A Scatter chart customised to like the charts in Google Webmaster Tools

[No canvas support]

This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.scatter.js"></script>
Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="200">
    [No canvas support]
</canvas>
This is the code that generates the chart:
<script>
    // Create some sample data
    for (var i=0, data = [], y=21; i<90; i+=1) {
        data.push([i, y = Math.max(0,y + RGraph.random(-5,5))]);
    }

    new RGraph.Scatter({
        id: 'cvs',
        data: data,
        options: {
            xmax: 90,
            labels: [
                ['January', 0],
                ['February', 30],
                ['March', 60]
            ],
            labelsSpecificAlign: 'left',
            line: true,
            tickmarks: null,
            backgroundGridAutofitNumvlines: 3,
            //textAccessible: true,
            textSize: 14,
            textAccessible: true,
        }
    }).trace2({frames: 60});
</script>

Share on Facebook Share on Twitter

« Back