Grid line view as background in Highchartjs?

Question

In Highchartjs we can have grid lines based on series points. However I'd like to modify that by adding as many grid lines as I prefer.

In other words, I'd like to set this Grid-line as a background for this JsFiddle highchartjs line-graph

From looking at the docs, both the xAxis and yAxis support gridlines

The question really is; Is it possible to do this? If so please shed some light to this matter.

Answer 1

This can be set pretty much as you said:

xAxis: {
  minorTickInterval: 0.25,
  gridLineWidth: 1
}, 
yAxis: {
  minorTickInterval: 0.25,
  gridLineWidth: 1
}

The minorTickInterval governs how many "boxes" you have. Since the tick interval is 1 here, I set the minorTickInterval to 0.25, 1/0.25 = 4. Setting it to 0.2 would give 5 small boxes. Naturally if you change scale on the axes this will change as well.

Working example: http://jsfiddle.net/ewolden/t0bzyywe/1/

API refs: gridLineWidth and minorTickInterval