A Donut chart with a 3D look using gradients

[No canvas support]

This goes in the documents header: 
<script src="RGraph.common.core.js"></script>
<script src="RGraph.pie.js"></script>
Put this where you want the chart to show up: 
<canvas id="cvs" width="475" height="350">
    [No canvas support]
</canvas>
This is the code that generates the chart: 
<script>
    new RGraph.Pie({
        id: 'cvs',
        data: [41,37,16,3,3],
        options: {
            colors: [
                'Gradient(#c00:red:#f66:red:#c00)', 
                'Gradient(#00c:blue:#66f:blue:#00c)',
                'Gradient(#0c0:#0f0:#6f6:#0f0:#0c0)',
                'Gradient(#c66:pink:pink:pink:#c66)',
                'Gradient(gray:#ccc:white:#ccc:gray)'
            ],
            variant: 'donut',
            linewidth: 5,
            exploded: 5,
            strokestyle: 'rgba(0,0,0,0)',
            align: 'left',
            shadowOffsetx: 2,
            shadowOffsety: 2,
            shadowBlur: 3,
            centerx: 185,
            textAccessible: true
        }
    }).draw();
</script>

« Back