score:1

Accepted answer

i found this, hereby a complete working fiddle to show you how it can be done: http://jsfiddle.net/nc37x/1345/

google.load('visualization', '1', {packages: ['corechart']});
google.setonloadcallback(drawvisualization);

function drawvisualization() {
    // example copied from google visualization api playground,
    // modified for category axis annotations

    // create and populate the data table.
    var data = new google.visualization.datatable();
    data.addcolumn('string', 'x');
    data.addcolumn({type: 'string', role: 'annotation'});
    data.addcolumn({type: 'string', role: 'annotationtext'});
    data.addcolumn('number', 'cats');
    data.addcolumn('number', 'blanket 1');
    data.addrow(["a", null, null, 1, 1, ]);
    data.addrow(["b", null, null, 2, 0.5]);
    data.addrow(["c", null, null, 4, 1]);
    data.addrow(["d", null, null, 8, 0.5]);
    data.addrow(["e", null, null, 7, 1]);
    data.addrow(["f", null, null, 7, 0.5]);
    data.addrow(["g", 'foo', 'foo annotation', 8, 1]);
    data.addrow(["h", null, null, 4, 0.5]);
    data.addrow(["i", null, null, 2, 1]);
    data.addrow(["j", null, null, 3.5, 0.5]);
    data.addrow(["k", 'bar', 'bar annotation', 3, 1]);
    data.addrow(["l", null, null, 3.5, 0.5]);
    data.addrow(["m", null, null, 1, 1]);
    data.addrow(["n", null, null, 1, 0.5]);

    // create and draw the visualization.
    new google.visualization.linechart(document.getelementbyid('visualization')).
    draw(data, {
        curvetype: 'function',
        width: 500,
        height: 400,
        vaxis: {
            maxvalue: 10
        },
        annotations: {
            style: 'line'
        }
    });
}

Related Query

More Query from same tag