Share: Bookmark with delicious tweet this site Post to Facebook

RGraph: HTML5 canvas graph library - Adjusting your graphs interactively

Since 24th May 2010 you have had the ability to adjust your graphs interactively. Currently the Bar chart, Line chart, Progress Bar, Rose chart and the Tradar have this facility. Some graph types use multiple event handlers and as such are unlikely to work well with other dynamic features. The Line chart is an example of this, and whilst it does work with the context menu (and so the full canvas zoom), it is unlikely to work with other dynamic features.

At the current time this feature on the Bar and Line charts doesn't work with X axis in the center.

If your intention is to make some sort of interactive console, new HTML5 input types may also be of interest (for example the new range input type which gives you a "slider bar"). Eg (Chrome/Safari/Opera):

Note

Since interactivly adjusting a chart involves completely redrawing it, having a lot of them on one page can cause slower updates. For this reason each example chart is on its own page:

DOM2 event handlers

In January 2011 all adjusting was converted to DOM2 event handling. This makes adjusting work much better with other dynamic features.