Animation on area graph when y axis does not start at 0

[LORDINGBEATEN]

Description

On an area type chart. If the min and max values ​​on the y axis are high, the animation is ugly.

The animation seems to systematically start from 0 and therefore if the graph only has large values, only the end of the animation is displayed (we almost have a display without animation).

Steps to Reproduce

Example to reproduce the case:

https://codepen.io/LORDINGBEATEN/pen/vYommXX

        var options = {
          series: [{
          name: 'series1',
          data: [242737,242737,242776,242776,242776,242828,242861,242903,242943,243029]
        }],
          chart: {
          height: 350,
          type: 'area',
            animations: {
                enabled: true,
                easing: 'easeout',
                speed: 800,
                animateGradually: {
                    enabled: true,
                    delay: 150
                },
                dynamicAnimation: {
                    enabled: true,
                    speed: 350
                }
            }
        },
        dataLabels: {
          enabled: false
        },
        stroke: {
          curve: 'smooth'
        },
        xaxis: {
          type: 'date',
          categories: ["2024-08-15","2024-08-16","2024-08-17","2024-08-18","2024-08-19","2024-08-20","2024-08-21","2024-08-22","2024-08-23","2024-08-24"]
        },
        tooltip: {
          x: {
            format: 'yyyy-MM-dd'
          },
        },
        };

        var chart = new ApexCharts(document.querySelector("#chart"), options);
        chart.render();

Expected Behavior

Animation should start from min of y axis.

Actual Behavior

The feed seems to start from the value 0 of the y axis.

Screenshots

Reproduction Link

<div id="chart">
</div>

#chart {
  max-width: 650px;
  margin: 35px auto;
}

        var options = {
          series: [{
          name: 'series1',
          data: [242737,242737,242776,242776,242776,242828,242861,242903,242943,243029]
        }],
          chart: {
          height: 350,
          type: 'area',
            animations: {
                enabled: true,
                easing: 'easeout',
                speed: 800,
                animateGradually: {
                    enabled: true,
                    delay: 150
                },
                dynamicAnimation: {
                    enabled: true,
                    speed: 350
                }
            }
        },
        dataLabels: {
          enabled: false
        },
        stroke: {
          curve: 'smooth'
        },
        xaxis: {
          type: 'date',
          categories: ["2024-08-15","2024-08-16","2024-08-17","2024-08-18","2024-08-19","2024-08-20","2024-08-21","2024-08-22","2024-08-23","2024-08-24"]
        },
        tooltip: {
          x: {
            format: 'yyyy-MM-dd'
          },
        },
        };

        var chart = new ApexCharts(document.querySelector("#chart"), options);
        chart.render();

[brianlagunas]

No reproduction link was provided (code snippets don't count). I will reopen when the link has been provided.

[LORDINGBEATEN]

Link codepen.io add

https://codepen.io/LORDINGBEATEN/pen/vYommXX

[brianlagunas]

This is not so much a bug, but rather a request to improve the animations when dealing with large values. Reopening for consideration of a future improvement.