Moving Window to another monitor causes the graphics to be wrongly sized

[hfhchan]

This happens on macOS and FIrefox.

When opening the window on a normal screen then dragging it to a retina screen, all the graphics are scaled up to 200% of its original size. When dragging the window back to a normal screen, the graphics are drawn normally again.

Vice-versa, When moving a window from a retina screen to a normal screen, upon hover the charts get drawn at 50% of the intended size. When dragging the window back to a retina screen, the graphics are drawn normally again.

Here are the screen captures (click on image to see actual drawn bounds):

Correct Display (window opened on normal screen):

Scaled up by 200% when window dragged to retina screen (from normal screen):

Scaled down to 50% when rendered on retina screen, then dragged back to normal screen:

amCharts version: v5.2.2 Firefox: 101.01a

[hfhchan]

(It appears to be using a cached value of window.devicePixelRatio somewhere.)

[martynasma]

We do monitor for changes in devicePixelRatio, which is needed to detect mobile screen rotations, browser zooms, etc.

If this does not kick in on Firefox on MacOS, it must be a bug in the browser.

At this time I can't easily setup testing environment you described, so if you could verify this happens only in Firefox (and not Safari or Chrome), that would be super helpful.

[hfhchan]

I can reproduce on macOS with Chrome 101.0.4951.54 on the amcharts demo page https://www.amcharts.com/demos/column-with-rotated-series/.

[hfhchan]

I cannot reproduce on Safari 15.4 (17613.1.17.1.13).

[hfhchan]

I can confirm the implementation at https://stackoverflow.com/a/71774031/923437 works for both the Firefox and Chrome versions mentioned above.

[martynasma]

Thanks for additional details. We'll need to do some more digging.

[martynasma]

OK, I've now have Macbook Pro + External display setup.

I've tried changing resolutions on external display. Dragging demo window between them. Can't quite reproduce the effect you are describing.

Can you describe what exactly you are doing to reproduce it?

[hfhchan]

I am just dragging the Chrome / Firefox window between a retina screen and a non-retina screen.

I'm using an M1 not sure if there is any difference.

Let me take a screen cap on Monday.

[hfhchan]

I have two external screens, one connected via USB-C and one via DisplayLink adapter from USB to HDMI.

[martynasma]

I'm afraid this setup is too niche to replicate. The issue does not seem to be happening with more common setups, so I can't assign it a high priority. We might come back to it at some point in the future. Let's leave this open.

[hfhchan]

I can still reproduce this when I have plugged in one external screen only. Main screen is MBP M1 @ Default scale. External screen is 2560 x 1440 with pixel density = 1, plugged in via USB-C.

[hfhchan]

https://user-images.githubusercontent.com/8191296/167993013-0d7bbc7a-f9bd-4267-82c6-ffc8ac37b094.mp4

[hfhchan]

I can still reproduce this when I have plugged in one external screen only. Main screen is MBP M1 @ Default scale. External screen is 2560 x 1440 with pixel density = 1, plugged in via USB-C.

Are you able to reproduce this issue? I think this configuration is fairly common.

[martynasma]

Not yet, I'm afraid.