[Solved]-How to remove the line/rule of an axis in Chart.js?-Chart.js

score:31

I found a way to remove this line. It's actually called the border of the axis and there's an option for it, see "Grid Line Configuration":

scales: {
    yAxes: [{
        gridLines: {
            drawBorder: false,
        }
    }]
}

lampshade 2270

score:-2

You can use the scaleLineColor: 'transparent' it will remove the y any x axis

Parthasarathy 178

score:0

gridLines: {zeroLineColor: 'transparent'}

Dor Levi 85

score:0

this workerd for me yAxes: [ { gridLines: { display: false, }, }, ],

Kuro Neko 1

score:2

The left line is still coming from the x axis grid lines. Changing the 'zeroLineColor' of the x axis to 'transparent' hid it.

xAxes:[{
gridLines:{
zeroLineColor:'transparent'
}}]

Dy4 507

score:4

This should work

 options: {
     scales: {
          yAxes: [{
               gridLines: {
                  display: false,
              }
          }]
     },
  }

eaglebearer 1590

score:4

This worked for me in version 2.8.0 -

scales: {
    yAxes: [{
        gridLines: {
            tickMarkLength: false,
        }
    }]
}

monika 114

score:4

In v3 you can do:

options: {
  scales: {
    y: {
      grid: {
        drawBorder: false,
      }
    }
  }
}

pegido 509