Custom Horizontal Gridlines With Google Visualization API

Question

Is it possible to add horizontal gridlines at irregular intervals to a Google Visualization ColumnChart? Something similar to the Good, Better, Best markers on this image chart:

I have tried to figure it out myself, but have only found ways to add gridlines at regular intervals. Nothing at arbitrary locations.

If Google Visiualization can't do this, can anyone suggest a good javascript svg charting library that can?

Answer 1

Use the vAxis.ticks option:

vAxis: {
    ticks: [{v: 1, f: 'Good'}, {v: 3, f: 'Better'}, {v: 4, f: 'Best'}]
}

Each element in the ticks array is an object with v and f properties: the v property is the value to place the label at, and the f property is the label to use.