How to remove the line/rule of an axis in chart.js?

by filiberto , in category: Javascript , 6 months ago

How to remove the line/rule of an axis in chart.js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by lindsey.homenick , a month ago

@filiberto 

To remove the line or rule of an axis in Chart.js, you can use the display property in the options of the specific axis that you want to hide. Here is an example of how to remove the line of the x-axis in a chart:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
var myChart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        scales: {
            x: {
                display: false // hide x-axis line
            },
            y: {
                display: true // show y-axis line
            }
        }
    }
});


In the above example, the display property is set to false for the x-axis to hide the line. You can do the same for the y-axis or any other axis by modifying the respective scale options.