[Chartjs]-How to hide more than one legend on Chartjs?

by

1👍

Found the Answer on this link

Basically what I’ve done is to insert this statement on options:

    legend: {
        labels: {
            filter: function(legendItem, chartData) {
                if (legendItem.datasetIndex === 0 || legendItem.datasetIndex === 1 ) {
                    return false;
                }
            return true;
            }
        }
},

I believe that solved my problem

0👍

Rather than hide them at the options level, hide them at the label level:

    datasets: [{
      label: 'Legend 1',
        hidden: true,
      data: [12, 19, 3, 5, 2, 3],
    }, {
      label: 'Legend 2',
      hidden: true,
      data: [11, 12, 33, 4, 2, 3],

0👍

It took a bit of time to realize for chartjs V3, it’s plugins inside options:

options: {
        plugins: {
            legend: {
                labels: {
                    filter: function(legendItem, data) {
                        let label = data.datasets[legendItem.datasetIndex].label || '';
                        if (typeof(label) !== 'undefined') {
                            if (legendItem.datasetIndex >= 3){
                                return false;
                            }
                        }
                        return label;
                    }
                }
            }
        },
    },

Leave a comment