[Chartjs]-Removing exceeding parts of axis


You can hide the grid-lines from the scales:

yAxes: [{
  gridLines: {
    display: false

You won’t see any exceeding lines, if you do this for both axes.

See this fiddle for a working demo

If you need the grid-lines and only want to hide the exceeding line at 0, you can set the zeroLineWidth to 0

gridLines: {
  zeroLineWidth: 0

With tickMarkLength you can determin how many pixels the grid-lines draw into the axis area.

gridLines: {
  tickMarkLength: 0

If you need more advanced styling of the axis, you can write a plugin. See Style X and Y Axis (tick mark) with Chart.js? for a good start.

Leave a comment