Adjusting your charts interactively - Semi-circular Progress

Information about adjusting the Semi-circular Progress bar. It can be used to highlight values or control something via a webpage.

The Semi-circular Progress can be adjusted by clicking on it. When adjusting is finished the adjustend event fires. If you attach a function to the adjustend event (as below) you can get the new value by looking at the value property (eg obj.value). The events log the value to the console.

[No canvas support]
<script>
    var scp = new RGraph.SemiCircularProgress({
        id: 'cvs',
        min: 0,
        max: 100,
        value: 83,
        options: {
            marginTop: 10,
            marginLeft: 10,
            marginRight: 10,
            adjustable: true,
            scaleUnitsPost: '%',
            colors: ['Gradient(white:#0a0)']
        }
    }).draw().on('adjustbegin', function ()
    {
        console.log('Old value: ' + scp.value  );
    }).on('adjust', function ()
    {
        console.log('Value during adjustment: ' + scp.value  );
    }).on('adjustend', function ()
    {
        console.log('New value: ' + scp.value  );
    });
</script>