The Bar chart from the front page

This is the Bar chart from the front page of the website (as of 10th September 2012).

[No canvas support]

This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.effects.js"></script>
<script src="RGraph.common.tooltips.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.bar.js"></script>
Put this where you want the chart to show up:
<canvas id="cvs" width="600" height="250">
    [No canvas support]
</canvas>
This is the code that generates the chart:
<script>
    window.onload = function ()
    {
        var bar = new RGraph.Bar({
            id: 'cvs',
            data: [[45,60],[65,30],[40,80],[62,48]],
            options: {
                labels: ['Luis', 'Kevin', 'John', 'Gregory'],
                tooltips: ['Luis','Luis','Kevin','Kevin','John','John','Gregory','Gregory'],
                textAccessible: true,
                ymax: 100,
                strokestyle: 'white',
                linewidth: 2,
                shadow: true,
                shadowOffsetx: 0,
                shadowOffsety: 0,
                shadowBlur: 10,
                hmarginGrouped: 2,
                unitsPre: '$',
                title: 'An example Bar chart',
                gutterBottom: 25,
                gutterLeft: 40,
                gutterRight: 15,
                gutterTop: 27,
                colors: ['Gradient(white:rgba(255, 176, 176, 0.5))','Gradient(white:rgba(153, 208, 249,0.5))'],
                backgroundGridAutofitNumhlines: 5,
                backgroundGridAutofitNumvlines: 4
            }
        }).fadeIn({'duration': 250});
    };
</script>

Share on Facebook Share on Twitter

« Back