In React JS graph gets redrawn whenever data changes in useEffect

[AbhishekDigitalSalt]

I am implementing am chart in React JS. To update the chart we need to update the state as per react architecture, and whenever I update the state with new data, useLayoutEffect runs again and whole chart gets redrawn. Is there any way to prevent redrawing of whole chart in React JS?

[martynasma]

Are you creating the whole chart in useLayoutEffect? You should only update changes in it:

https://www.amcharts.com/docs/v5/getting-started/integrations/react/#Using_with_hooks

[shanqq]

in useEffect create one dependency and if that dependency gets change you will update the chart by first disposing the chart and creating it right.

[AbhishekDigitalSalt]

in useEffect create one dependency and if that dependency gets change you will update the chart by first disposing the chart and creating it right. yes. but whenever dependency updates charts gets redrawn with new values. but I don't want it to get redrawn on every update.

[shanqq]

but the data is getting change right then how you will get that done. by not redrawing that part.

[shanqq]

maybe you can do if the root is there then don't dispose ?? am5.array.each(am5.registry.rootElements, function (root) { if ((root == null)) { root.dispose() } })

[github-actions[bot]]

This issue is stale because it has been open 30 days with no activity. It will be closed in 5 days unless a new comment is added.