(During) a chart animation it prevent from loading a new chart using update('none')
Expected behavior
When I update a chart that is doing some animation, using update("none"), it should instantly stop the animation it is doing, and switch to the other chart.
Instead it just keep animating the preceding chart and discard the new data
Current behavior
If I animate a chart, and then directly update('none') to a second chart, it won't load the second chart unless you wait until the first chart animation is done
Reproducible sample
https://codepen.io/nicolas-keroack/pen/gOegxyK
Optional extra steps/info to reproduce
No response
Possible solution
Love to the chart.js devs, wish I will be to your programming level one day. For now I will keep learning but I can't provide to the project yet even if i'd love to :p
Context
I have a page system, and need to reload the chart directly sometimes and sometimes with the animations
chart.js version
3.8.0
Browser name and version
Chrome 103.0.5060.114
Link to your project
No response
@heavyStuff3000 can you try to stop the animation before updating by myChart.stop();?
function second_chart() {
myChart.data.labels = ["äpple", "orange", "banana", "pear", "peach", "raisins"];
myChart.data.datasets[0].data = [22, 1, 21, 23, 21, 45];
myChart.stop(); // <-- stops if animation is running
myChart.update('none');
}
function first_chart() {
myChart.data.labels = ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"];
myChart.data.datasets[0].data = [12, 19, 3, 5, 2, 3];
myChart.update();
}
It worked! But is it considered a bug or is it intended to be like this? thanks a lot!
I don't know if it's working as design. I think the update could check if there is a running animation and stop it as first thing. I think it's better do not close this issue in the meantime.
I´m not sure if my case here is related, however i think so because when i set animation duration to 0 then its not doing that strange flicker. I´ve also tryed adding .stop as sugested. https://user-images.githubusercontent.com/35345288/190192998-63dbdbb0-ff50-4850-a303-6a9b54ae618f.mp4