Categories
JavaScript Answers

How to load totally new data with Chart.js and JavaScript?

Spread the love

Sometimes, we want to load totally new data with Chart.js and JavaScript.

In this article, we’ll look at how to load totally new data with Chart.js and JavaScript.

How to load totally new data with Chart.js and JavaScript?

To load totally new data with Chart.js and JavaScript, we call destroy on the existing chart and then we create a new chart.

To do this, we write

myLineChart.destroy();

to destroy the myLineChart chart with destroy.

Then we write

const ctx = document.getElementById("myChartLine").getContext("2d");
myLineChart = new Chart(ctx).Line(data, options);

to get the canvas with getElementById.

Then we get the canvas context with getContext.

Finally, we create the new chart with the Chart constructor and the Line method.

Conclusion

To load totally new data with Chart.js and JavaScript, we call destroy on the existing chart and then we create a new chart.

Leave a Reply

Your email address will not be published.

If you like the content of this blog, subscribe to my email list to get exclusive articles not available to anyone else.