Graphs are flickering on mobile.
armand200011 opened this issue · comments
I came across this issue in the project I am working on where the graphs are flickering and jumping around and is just not functioning. This only happens on mobile, but when I press F12 and go into developer tools on any PC to simulate a mobile screen size, everything works nicely, so I am not sure if it an issue related to screen size.
I have test on two different phone models and on both of them the issue occurred firstly on Xaomi Redmi Note 11 Pro and on a Samsung Galaxy A34.
This issue only occurs on the Chrome browser, it works perfectly on FireFox browser.
I opened the online documentation for Blazor-ApexCharts and even the example charts that they have on their website are giving the same issues as I mentioned above.
Below are two videos capturing what I have experienced. The first link is a video from Chrome where the graphs are flickering and jumping around, and the second link is the video of that same page on FireFox where everything is working normally.
Chrome link:
https://drive.google.com/file/d/1VdGMAr8S2fJ6ePGKy8JOxQx1FmIXFYSs/view?usp=sharing
FireFox link:
https://drive.google.com/file/d/1jDZ-02OH_Lb4IDh3aJl8bxVtpCSqMYB0/view?usp=sharing
Found the same issue on the Huawei Mate 20 Pro. The graphs only used to bug out when I tried using a tooltip, but now it completely bugs out when loading and scrolling.
I have noticed this as well. In my project that I am working on I have noticed it happening when ever I try to see a tooltip for a graph.
I seem to be having this issue. Weirdly it only happens on certain phone screens.
My phone Samsung s24 doesn't do it, so I never noticed it, but one of our end users showed me the other day and I thought it was our code, but I now see thank to @armand200011 that it also does it on your guys demo site.
Please can you guys look into this and suggest a fix asap.
Hi,
Do you see the same behavior on the apexchart.js site https://apexcharts.com/javascript-chart-demos/
Hi, @joadan
I tested now again on the apexchart.js site on both chrome and fire fox browsers. The graphs were still getting duplicated sometimes and not functioning correctly on chrome, compared to fire fox browser where I opened that same page but everything functions properly.
Below were my findings when I opened the site on both browsers.
Chrome link:
https://drive.google.com/file/d/1MS1MBO0PP0hrlc-mtRukhqIBDwRzOssb/view?usp=sharing
Fire Fox link:
https://drive.google.com/file/d/1gPIAHEsQZKGYFkA5A3uUh1Ot_ccfY-0h/view?usp=sharing
Hello,
Please raise this issue in the apexcharts.js repo.
I’m sorry for the inconvenience.
regards Joakim