This is a demonstration of a Semi-Circular Progress that haas been configured to use the grow effect. It also has units and decimals enabled.
This goes in the documents header:<script src="RGraph.svg.common.core.js"></script> <script src="RGraph.svg.semicircularprogress.js"></script>Put this where you want the chart to show up:
<div style="width: 450px; height: 250px" id="chart-container"></div>This is the code that generates the chart:
<script> new RGraph.SVG.SemiCircularProgress({ id: 'chart-container', min: 0, max: 100, value: 34.99, options: { colors: ['Gradient(white:green)'], backgroundStrokeLinewidth: 1, backgroundStroke: 'black', backgroundFill: 'gray', backgroundFillOpacity: 0.25, labelsCenterUnitsPre: '$', labelsCenterDecimals: 2 } }).grow(); </script>