Sometimes, we want to clear a chart from a canvas so that hover events cannot be triggered with Chart.js and JavaScript.
In this article, we’ll look at how to clear a chart from a canvas so that hover events cannot be triggered with Chart.js and JavaScript.
How to clear a chart from a canvas so that hover events cannot be triggered with Chart.js and JavaScript?
To clear a chart from a canvas so that hover events cannot be triggered with Chart.js and JavaScript, we call destroy
to destroy the chart.
For instance, we write
let myPieChart = null;
//...
const drawChart = (objChart, data) => {
if (myPieChart !== null) {
myPieChart.destroy();
}
const ctx = objChart.getContext("2d");
myPieChart = new Chart(ctx).Pie(data, { animateScale: true });
};
to create the drawChart
function that calls myPieChart.destroy
if myPieChart
isn’t null
to clear the chart.
Then we get the objChart
‘s canvas context with getContext
.
And we set myPieChart
to a new chart created within the ctx
context.
Conclusion
To clear a chart from a canvas so that hover events cannot be triggered with Chart.js and JavaScript, we call destroy
to destroy the chart.