Chartjs-When doing an update to the data and labels the chart is not able to add more columns

by

0👍

I would advise to take a look at https://www.chartjs.org/docs/latest/developers/updates.html to see how to update Chart.js data and labels.

Taking a look at the your code snippet, which updates the chart here:

Your code snippet to be changed

chart2data = response.data;
console.log(response.data);
console.log(chart2data.years);

chart2config.labels = chart2data.years;
chart2config.data.datasets[0].data = chart2data.summer;
var chart2 = new Chart(ctx_archive_live,chart2config);

Updating an existing chart

If possible, update an existing chart instance. I changed your snippet accordingly, where chartObj is your Chart instance:

chartObj.data.labels = response.data.year;
chartObj.data.datasets[0].data = response.data.summer;

chartObj.update();

Double check, that your response.data is in the correct form and that you actually have access to the chart2config object where you are updating. Then following the Chart.js docs about updating, as I tried above with limited knowledge about your data, should work.

Instantiating a new chart

In case you do not want to update an existing chart, but do want to create a new one, I think the problem with your code snippet might be that you have to assign the labels to the data property inside the config object. Try this instead:

chart2config.data.labels = response.data.years;
chart2config.data.datasets[0].data = response.data.summer;
var chart2 = new Chart(ctx_archive_live, chart2config);

Leave a comment