Adjusting your charts interactively - VProgress bar

  Read comments... [No canvas support]

Nothing pertinent is kept in the registry. If you wish to get the new value of the progress you can check obj.value. If you want the value before the adjustment, you can check the value with the onadjustbegin event (instead of the onadjustend event).

The RGraph adjusting events

There are three RGraph events associated with adjusting. The onadjustbegin event fires when adjusting begins. Much like the onmousedown event. The onadjust event fires during adjusting, much like the onmousemove event. The onadjustend event fires when adjusting is finished, much like the onmouseup event.

Some examples of using the three events. Each gets the shape information (ie the applicable bar) from the RGraph registry.


<script>
   var vprogress = new RGraph.VProgress({
        id: 'cvs',
        min: 0,
        max: 100,
        value: 83,
        options: {
            colors: ['red'],
            adjustable: true,
            margin: 5,
            tickmarksInner: true,
            labelInner: true,
            unitsPost: '%',
            gutterRight: 45,
            textAccessible: true
        }
    }).draw().on('adjustbegin', function (obj)
    {
        document.getElementById("output").value += 'Value before adjustment: ' + obj.value + '\n';
    }).on('onadjust', function (obj)
    {
        document.getElementById("output").value += 'Value during adjustment: ' + obj.value + '\n';
    }).on('adjustend', function (obj)
    {
        document.getElementById("output").value += 'Value after adjustment: ' + obj.value + '\n';
    });
</script>
Share RGraph
X

Comments