A Pie chart thats configured as a donut chart (ie a Pie chart with a big hole in the middle!) It uses gradients as colours and a shadow to add a degree of depth to the chart.
This goes in the documents header:<script src="RGraph.svg.common.core.js"></script> <script src="RGraph.svg.common.tooltips.js"></script> <script src="RGraph.svg.pie.js"></script>Put this where you want the chart to show up:
<div style="width: 350px; height: 350px" id="chart-container"></div>This is the code that generates the chart:
<script> new RGraph.SVG.Pie({ id: 'chart-container', data: [5,3,8,4,6,4], options: { exploded: 5, donut: true, title: "Browser share", tooltips: ['MSIE 7 (41%)', 'MSIE 6 (37%)', 'Firefox (16%)', 'Safari (3%)', 'Other (3%)'], shadow: true, colors: [ 'Gradient(red:red:red:#faa:red)', 'Gradient(#0f0:#0f0:#0f0:#afa:#0f0)', 'Gradient(#00f:#00f:#00f:#aaf:#00f)', 'Gradient(gray:gray:gray:#ccc:gray)', 'Gradient(#f0f:#f0f:#f0f:#faf:#f0f)', 'Gradient(#ff0:#ff0:#ff0:#ffa:#ff0)', 'Gradient(red:red:red:#faa:red)' ] } }).roundRobin(); </script>