Add horizontal reference line to Google charts' LineChart

Question

I'm using Google visualization's LineChart to display some data (it works).

The chart shows performance tests results and those results should not be over some value (eg. response time should not be more than 20ms). Si I'd like to draw that maximum (an horizontal line I guess) without having to add a new (dummy) series of data.

Is that possible?

Thanks a lot,

Alban

Answer 1

No, you can't add another line without adding another series of data, but you don't have to add it manually - a DataView would suffice to calculate it for you:

var maxResponseTime = 20;
var view = new google.visualization.DataView(data);
view.setColumns([0, 1[, 2, 3, 4.... /* specify all of your existing columns here */, {
    type: 'number',
    calc: function () {
        return maxResponseTime;
    }
}]);

var chart = new google.visualization.LineChart(...);
chart.draw(view, {
    // options
    series: {
        // "n" should be the series index of the max line
        // typically this is column index - 1,
        // so if you have one domain column, one data series
        // and the max line, it would be:
        1: {
            visibleInLegend: false, // set this if you don't want it in the legend
            enableInteractivity: false // set this if you don't want the line to spawn tooltips
        }
    }
});