I am using react-highcharts (wrapper for highcharts) and enabled animations for better user experience, but the animation occurs in every render, as example:
https://media.giphy.com/media/JAQVpMKbeXh1Y9jAJ6/giphy.gif
Is there a way for making animations only once?
I'll be glad for any help thanks
For a cleaner user-experience I would recommend using the animation only once on the first render of the component, hence, if you are using React hooks for example, use the useEffect hook, to apply the animation, but send an empty array as the second argument of useEffect so it will render the animation only once after the first render is triggered.
useEffect(() => {
// Apply animation
}, []);