How to increase gaps between vertical gridlines in chartjs

Question

I have drawn a chart using Chartjs for a large number of datasets. So, there are many vertical gridlines by default which looks pathetic. I want to increase the gap between the vertical lines.

Any help will be appriciated.Thanks

Answer 1

You can make use of the maxTicksLimit, this will make it so only that amount of ticks will get rendered which in turn makes the distance between ticks larger

code:

options: {
  scales: {
    xAxes: [
      {
        ticks: {
          maxTicksLimit: 10
        }
      }
    ]
  }
}

Source: https://www.chartjs.org/docs/latest/axes/cartesian/linear.html