A Rose chart showing the mouseout event

[No canvas support]

This goes in the documents header: 
<script src="RGraph.common.core.js"></script>
<script src="RGraph.common.dynamic.js"></script>
<script src="RGraph.rose.js"></script>
Put this where you want the chart to show up: 
<div style="padding: 15px">
    <canvas id="cvs" width="350" height="350">[No canvas support]</canvas>
</div>
This is the code that generates the chart: 
<script>
    new RGraph.Rose({
        id: 'cvs',
        data: [12,18,10,9,6,20,18],
        options: {
            labelsAxes: 'n',
            margin: 5,
            colors: ['Gradient(white:rgba(255,0,0,0.9))'],
            highlightStroke: 'black'
        }
    }).draw().on('mouseover', function (e, shape)
    {
        shape.object.highlight(shape);

    }).on('mouseout', function (obj)
    {
        RGraph.redraw();
    });
</script>

« Back