apexcharts / apexcharts.js

📊 Interactive JavaScript Charts built on SVG
https://apexcharts.com
MIT License
14.05k stars 1.28k forks source link

Area path animation glitching issues #4452

Closed rosco54 closed 2 months ago

rosco54 commented 2 months ago

Recent refactoring of line paths creation to fix various issues did not update the pathFromArea paths, upsetting animation morphing from those paths to final areaPaths.

1) Remove redundant graphics.move() from end of lower rangeArea paths. 2) Add closing line segment to pathFromArea path.

Fixes #4437

This has fixed the major issue but is still not perfect. There does appear to be an overall improvement visually over 3.45.2, the version preceeding the start of these refactoring efforts. If we compare, for example, the area-spline sample generated by 3.45.2 with that obtained after this patch, there is no longer a split between the line path and fill at every datapoint during the morphing process. There is instead a single artifact with the last datapoint that it would be nice to resolve.

Type of change

Please delete options that are not relevant.

Checklist:

AleksandrZhukov commented 1 month ago

@rosco54 @junedchhipa This commit creates glitch with gradient -

https://github.com/apexcharts/apexcharts.js/assets/8876116/a25951fe-ebcd-4fe5-a336-da6c8311f882