[Chartjs]-Chart.js Update to X Axis Not Updating

0πŸ‘

I suggest to disable chart animation, and instance the chart and canvas inside a variable and then try to destroy chart and make undefined the canvas (to free memory), aftwerwards create a new chart.

0πŸ‘

var chart_holder, canvas_holder = null;

function drawChart(){
    try{
      chart_holder.destroy()
      canvas_holder = undefined;
    }catch(e){}

    canvas_holder = document.createElement("canvas");
    $('#divelement').empty().append(canvas_holder);

    chart_holder = new Chart(canvas_holder, {
        type: 'bar',
        data: data,
        options: {...}
    })
}

0πŸ‘

You have to instance the chart in a variable and update the variable. You can see it in my jsbin.

You can find more information about updating charts in the docs.

Important part:

let chart = new Chart(document.getElementById("chart"), { // can be any variable name
  type: 'line',
  data: data,  
  options: options
});

function addDataButton(){
  addData()
  chart.update() // chartInstance.update()
}

Leave a comment