Search code examples
javascriptchart.js

Chart.js - How to remove percentage data labels?


I'm using Chart.js and I want to remove labels with percentage marked with red circle on image below.

Example

I'm using this code to produce this chart:

const options = {
    responsive: true,
    title: {
        display: false
    },
    legend: {
        display: false
    },
    tooltips: {
        mode: 'index',
        intersect: true
    },
    scales: {
        yAxes: [{
            type: 'linear',
            position: 'left',
            id: 'y-axis-1'
        }, {
            type: 'linear',
            position: 'right',
            id: 'y-axis-2',
            gridLines: {
                drawOnChartArea: false
            }
        }],
    }
};

new Chart(document.getElementById('originalThirdChart').getContext('2d'), {
    type: 'bar',
    data: data,
    options: options
});

How can I do this? Thanks in advance!


Solution

  • There must be some logic in your code. ctx.fillText(value + '%', position.x, position.y); like this. I don't see that in your code given code. if it is there, Please remove it. It will work.