Search code examples
javascriptajaxamcharts

Live chart completely refreshing in amCharts


I would like to create a live chart using amChart.js, So I'm using ajax for live chart update. If I called the ajax page in setInterval the chart is completely refreshing. Actually, I need to change the data only.

Please check my script from JSFiddle.

How can I solve this issue?

Thanks in advance.


Solution

  • By "change the data only" if you mean transitioning to new points or values, then you can't replace the entire array. Replacing the entire array will always cause a complete redraw. Note that you usually don't need to call invalidateData when replacing the entire array.

    If you want your chart to transition to the new values, then you have to change how you update your data. If you update the data in-place and call invalidateRawData, AmCharts will animate from one Transitions only occur if you're updating data in place and calling invalidateRawData or if you're using addData to add data to the array. Not knowing what your data looks like in your ajax requests, you'll need to figure out the best approach.

    You can read more about how to manage incremental/transitional updates here.