6
votes

I'm using Chart.js v2.7.2 and want to remove the "label" field. Leaving it off returns "undefined" and the various options I've tried have done nothing. Anyone have new insight on this? Legend, title, etc all fail to remove it.

let thisChart = new Chart(gov_chart, {
        type: 'horizontalBar',
        data: {
            label: 'I want to remove this',
            labels: [data1, data2],
            datasets: [{
                backgroundColor: ['rgb(240,61,74)', 'rgb(0, 156, 255)'],
                data: [data1.count, data2.count],
                }]
            },
        options: {
            scales: {
                xAxes: [{
                    ticks: {
                        beginAtZero: true
                        }
                    }]
                }
            },
            legend: {
                display: false
            },
            title: {
                display: false
            },
            tooltips: {
                callbacks: {
                    label: function(tooltipItem) {
                        return tooltipItem.yLabel;
                    }
                }
            }
        });
2

2 Answers

9
votes

Note, this answer is outdated. To remove the legend you now have to specify the plugin. https://www.chartjs.org/docs/latest/configuration/legend.html

eg

var chart = new Chart(ctx, {
type: 'bar',
data: data,
options: {
    plugins: {
        legend: {
            display: false
        }
    }
}

});

7
votes

The label should be inside datasets such as

type: 'horizontalBar',
data: {  
  labels: [data1, data2],
  datasets: [{
    label: 'put it here', // => here
    backgroundColor: ['rgb(240,61,74)', 'rgb(0, 156, 255)'],
    data: [data1.count, data2.count],
  }]
},

so you won't get undefined

Updated: if you don't want to see it, put legend configuration inside the options. Apparently, I saw that your legend is outside options object.

options: {        
  legend: {
    display: false
  }
}