An example of the Rose chart where the segment sizes are unequal - thus allowing you to show an extra dimension of information.
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.rose.js"></script>Put this where you want the chart to show up:
<div style="width: 650px; height: 500px" id="chart-container"></div>This is the code that generates the chart:
<script> rose = new RGraph.SVG.Rose({ id: 'chart-container', data: [[56,5],[48,3],[81,2],[68,9],[45,9],[45,1],[12,3],[43,8],[65,2],[42,3]], options: { colorsStroke: 'white', linewidth: 3, variant: 'non-equi-angular', colorsSequential: true, colorsOpacity: 0.6, tooltips: ['Alf','Bert','Craig','Doug','Edgar','Fred','Gary','Harry','Indigo','Jack'], labels: ['Alf','Bert','Craig','Doug','Edgar','Fred','Gary','Harry','Indigo','Jack'] } }).draw();