Chartjs-Graph Chart.js dropdown menu – chart rendering

by

0👍

✅

You forgot to add the options object in your updateChartType function

function updateChartType() {
  myChart.destroy();
  myChart = new Chart(ctx, {
    type: 'line',
    data: options2.data,
    options: options2.options //<--- this line
  });
  myChart.getDatasetMeta(document.getElementById("chartType").value).hidden = false;
};

if you want the dropdown to toggle between different datasets, you can use the following:

You don’t need to create a new chart, you can simply update the current one, but
you need to call chart.update()

function updateChartType() {
  const val = document.getElementById("chartType").value
  for (const i in myChart.data.datasets) {
    if (i == val) myChart.getDatasetMeta(i).hidden = false;
    else myChart.getDatasetMeta(i).hidden = true;
  }
  myChart.update();
};

Leave a comment