Gauge chart Grow effect

[No canvas support] [No canvas support]

This goes in the documents header:
<script src="RGraph.common.core.js"></script>
<script src="RGraph.gauge.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 gauge1 = new RGraph.Gauge({
            id: 'cvs1',
            min: 0,
            max: 100,
            value: [80,100],
            options: {
                textAccessible: true
            }
        }).grow();

        var gauge2 = new RGraph.Gauge({
            id: 'cvs2',
            min: 0,
            max: 100,
            value: 100,
            options: {
                textAccessible: true
            }
        }).grow({frames: 25});
        
        
        setTimeout(function ()
        {
            gauge1.value = [10,20];
            gauge1.grow();

            gauge2.value = 16;
            gauge2.grow();
        }, 3500);
    };
</script>

Share on Facebook Share on Twitter

« Back