search

danvk / dygraphs

Interactive visualizations of time series using JavaScript and the HTML canvas tag
http://dygraphs.com
Other
3.16k stars 606 forks source link

Browser zooms cause issues with mouse xy positions #1048

Open HiveTechDev opened 1 month ago

HiveTechDev commented 1 month ago

Some browser's zoom behavior makes the x/y mouse position thrown off. When programmatically changing the zoom it looks like the canvas offset gets thrown off of the x/y and will cause hover and button clicks to be left/right depending on the zoom amount.

You can see this on any of the demos.

  1. https://dygraphs.com/tutorial.html
    • in console enter: document.body.style.zoom = "80%"
    • You can see this with any of the demos
  2. Chrome, if zoom is done programmatically with the above. Older IE browsers.
  3. 2.2.1 - But again, whats live on website.

If there is a workaround for this, would be great.

HiveTechDev commented 1 month ago

image

mirabilos commented 1 month ago

Tyler Hall dixit:

  • in console enter: document.body.style.zoom = "80%"

Isn’t that what Firefox has been warning of since years already, that the “nōn-standard zoom property” will not be supported or something?

HiveTechDev commented 1 month ago

This happens on older IE versions as well as some Firefox. If you mash ctrl +/- with chrome this will happen sometimes as well. It's hard to get it in that state but I have a couple of times.

This snippet was to force the case in which you can see it but it is also used by some other libraries and chrome plugins (not that I can control what everyone does for zoom).

Other libraries do support zooming. Thought it would be an issue to bring up.

mirabilos commented 1 month ago

Tyler Hall dixit:

This happens on older IE versions as well as some Firefox. If you mash ctrl +/- with chrome this will happen sometimes as well. It's hard to get it in that state but I have a couple of times.

Ah, okay.