[Chartjs]-How to update a chart using VueJS and ChartJS

by

3👍

✅

In the vue file, planetChartData is a reference to the object “planetChartData” from your js file. It is not a reference to the chart you create in createChart()

What you want is to return the created chart, so you can call update() on it:

createChart(chartId, chartData) {
  const ctx = document.getElementById(chartId);
  const myChart = new Chart(ctx, {
    type: chartData.type,
    data: chartData.data,
    options: chartData.options,
  });
  return myChart // <<< this returns the created chart
}

Then in mounted you can do this:

var chart = this.createChart('planet-chart', planetChartData)
chart.update();

Leave a comment