This is a mode of operation that the SVG Rose chart has but the canvas Rose chart does not. It's a stacked non-equi-angular variation - so as well as being stacked the angles of the segments are unequal too. It's appropriate for when you have data that has an extra dimension and which goes beyond just a straight-forward stacked or non-equi-angular Rose chart.
As well as the data being different to a regular Rose chart the background grid has been tweaked
so that the radial lines that emanate from center outwards have been turned off with the
backgroundGridRadialsCount
property.
The variant
property is the one that puts the chart into a non-equi-angular
mode:
variant: 'non-equi-angular'
The chart doesn't have to be stacked - you can also create a non-stacked
non-equi-angular
Rose if that suits your data better.
<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: 600px; height: 500px" id="chart-container"></div>This is the code that generates the chart: