RGraph: HTML5 canvas graph library > Documentation > Adjusting graphs interactively > Rose chart

The Rose chart can be adjusted by clicking and dragging the segments to the desired size. When the onadjustend event fires you can get the following segment information from RGraph.Registry.Get('chart.adjusting.rose.myrose') (where myrose is the canvas ID):

• X coordinate
• Y coordinate
• The radius of the segment
• Start angle (in DEGREES)
• End angle (in DEGREES)
• Numerical index of the segment, starting at the north axis and going clockwise.

<script>
    window.onload = function (e)
    {
        var rose = new RGraph.Rose('cvs',[4,3,5,6,2,1,4]);
        rose.Set('chart.gutter', 25);
        rose.Set('chart.colors.alpha', 0.5);
        rose.Set('chart.adjustable', true);
        rose.Set('chart.labels', ['Olga','Kev','Bob','Charlie','Pete','John','Fred']);
        rose.Draw();
        
        RGraph.AddCustomEventListener(rose, 'onadjustend', function (obj) {p(RGraph.Registry.Get('chart.adjusting.rose.cvs'));});
    }
</script>