CODEWITHSUNDEEP
javascriptreactjschart.jschart.js2
fcarle
fcarle

Reputation: 65

Chartjs destroy method not affecting the chart

Hi I have this code in my react app:

this.chart = new Chart(node, options);
// adding data to the chart ...
this.chart.destroy();
this.chart = null;
this.chart = new Chart(node, options);
// adding data to the chart ...

After adding data the second time, the first dataset still appears on the chart. I've also tried removing the canvas node but I get the same result. Anyone has any idea as to why this is happening?

Upvotes: 2

Views: 3841

Answers (1)

Negi Rox
Negi Rox

Reputation: 3932

var ctx = document.getElementById("barChart");
var barChart = new Chart(ctx, {
type: 'bar',
data: {
    labels: ["Dog", "Cat", "Pangolin"],
    datasets: [{
              backgroundColor: '#00ff00',
        label: '# of Votes 2016',
        data: [12, 19, 3]
        }]
    }
});

function addData(chart, label, color, data) {
  chart.data.datasets=[];
    chart.data.datasets.push({
    label: label,
  backgroundColor: color,
  data: data
});
chart.update();
}

// Changing the new dataset after 2 seconds

setTimeout(function() {
   addData(barChart, '# of Votes 2017', '#ff0000', [16, 14, 8]);
 }, 2000);

Upvotes: 2

Related Questions