1

I have a dynamic line chart that I am building with Chart.js with up to 19 datasets possible. I am dynamically entering the data into the datasets (which works great). The issue I am having is that if I have less than 19 datasets, the legend still shows for these unused datasets. I used to use this function with Chart.js 2.6.0 in the options list:

legend: {
 labels: {
  filter: function(item, chart) {
   return !item.text.includes('unused');
  }
 }
}

But this no longer works for Chart.js 3.2.0.

Does anyone know how to get this function to work with Chart.js 3.2.0?

This is how I currently assign the datasets:

for (i = 0; i < datasets.length; i++){
   myChart.data.datasets[i].data = datasets[i];
   myChart.data.datasets[i].label = labels[i];
};
for (j = datasets.length; j < 19; j++){
   myChart.data.datasets[j].label = 'unused';
};
myChart.update();
dclark3774
  • 31
  • 3

1 Answers1

2

The solution is to move the legend into the plugins for options.

plugins: {
   legend: {
      labels: {
         filter: function(item, chart) {
         return !item.text.includes('unused');
         }
      }
   }
},
dclark3774
  • 31
  • 3