Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

3.49.0 breaks area chart series toggling for series with larger numbers of values #4488

Closed
mrash opened this issue May 25, 2024 · 6 comments
Closed
Labels
bug Something isn't working

Comments

@mrash
Copy link

mrash commented May 25, 2024

Description

In 3.49.0, for area charts with multiple series with larger numbers of values (say, about 3,000), series toggling is broken - or, at least, highly unresponsive. See the attached .html example that reproduces this issue. The initial rendering of the graph is fine in 3.49.0 - only toggling a series to hide it via a mouse click has the problem. Note that 3.48.0 does not have this problem, and was likely introduced in commit 7f04fa3. For 3.48.0, series toggling is fast even for area charts with multiple large series. If this is related to linearscale() assumptions, would it be be possible to add a new attribute to allow the user to select the old behavior?

Steps to Reproduce

  1. Load the 'ap_issue.html' file from this gist against ApexChart 3.49.0 (note the '../../apexcharts/dist/apexcharts.js' path may need to be changed for your system).
  2. The chart should load showing three series: 'vals', 'moving_avg_100D', and 'exp_moving_avg_100D'.
  3. Select the 'vals' series in the legend and mouse click to try and toggle/hide it.
  4. The browser tab will become unresponsive.
  5. Switching to ApexCharts 3.48.0 or any prior version will not exhibit the above, and series toggling is fast and responsive.

Expected Behavior

Series toggling should be fast and responsive as seen in 3.48.0 and prior versions.

Actual Behavior

The browser tab becomes unresponsive (see screenshot below).

Screenshots

Here is the complete rendered page that includes the three series:
Full chart

When trying to toggle/hide the 'vals' series, mouse over 'vals' (which shows just the 'vals' series without the others), and then upon mouse click to toggle 'vals' the browser tab become unresponsive:
Screenshot 2024-05-25 at 2 34 21 PM

Under 3.48.0, here is what should be shown after the mouse click:
Screenshot 2024-05-25 at 2 35 12 PM

Reproduction Link

See the 'ap_issue.html' file from this gist - (note the '../../apexcharts/dist/apexcharts.js' path may need to be changed for your system to point to the correct path for ApexCharts).

@mrash mrash added the bug Something isn't working label May 25, 2024
@rosco54
Copy link
Contributor

rosco54 commented May 28, 2024

@junedchhipa I'll look into this.

@mrash @junedchhipa I confirm this issue in 3.49.0 using ap_issue.html although it appears to be as expected in 3.49.1. Would you be able to confirm that 3.49.1 performance is no worse than 3.48.0?

@mrash @junedchhipa Apologies, it is the current main branch revision in the repository that I believe works. 3.49.1 as released does not.

@junedchhipa I'm fairly certain that PR #4483 is the commit that fixed this issue.

@mrash
Copy link
Author

mrash commented May 28, 2024

@rosco54 Thanks, and confirmed that 3.49.1 has the issue. Also, I tried HEAD from the main branch, and the issue appears to be there too (same behavior as reported above).

@rosco54
Copy link
Contributor

rosco54 commented May 28, 2024

Please check the build process. I find that I often need to kill and restart npm run dev to get a build that reflects the src following a branch switch or checkout.

I get the following timings using HEAD (idle time removed):

Initial Load

Initial_load

Collapse Vals

Collapse_vals

@mrash
Copy link
Author

mrash commented May 29, 2024

Thanks @rosco54, that helps. It does appear that main HEAD has fixed the issue (I wasn't running the 'npm run dev' step before, but I see that is necessary now).

@rosco54
Copy link
Contributor

rosco54 commented May 30, 2024

@mrash Thanks for confirming.
@junedchhipa This issue can be closed as fixed by #4483

@mrash
Copy link
Author

mrash commented May 30, 2024

Thanks for the fast turn around time @rosco54. I look forward to the next release.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

3 participants