I was recently looking for an accessible way to generate chart data when I came across Chris Heilmann example for Generating charts from accessible data tables and vice versa using the Google Charts API. One of the limitations of Chris’s solution was it only generated pie charts. Having some time to kill over the weekend I’ve made some additions to Chris’s original script. The biggest change has been the inclusion of line charts.
The changes are probably best illustrated by this demo page. On this page I’ve copied Chris’s original pie charts and included the new charts generated by the script. Most of the changes reflect suggestions from the comments on Chris’s blog (i.e. alt tag [Ben Millard], fixed 3 digit limit [Robin Winslow]).
The big addition has been the inclusion of support for line charts. This uses the same principle of reading data from a table but unlike the original script which only read the first two columns the new script now reads in the entire table. Table headings are read as the data legends and the y-axis automatically scales to fit the entire data range (so far I’ve only got it working for absolute numbers).
One feature I’ve removed from Chris’s original script is the function to create a table from a chart.
You can download the script with the demo page and have a play around yourself. If anyone else is interested in developing this further leave a comment.
[I should also point out that I’m a ‘hack’ programmer so if anyone would like to tidy up my revised code please feel free].
Join the conversation
Great ‘hack’ you have there!
While the code was developed for pie and line graphs you can play around with different chart types called in the table class. Codes for different types are available from the Google Chart API
For example for a horizontal grouped bar chart you would have something like:
table class="tochart typebhg size460x300" ...
For a vertical grouped bar it would be:
table class="tochart typebvg size460x300" ...
My modified code isn’t designed for different types but could be easily modified if anyone wants to take-up the challenge …
But, did you notice, if i put any table before ( a clean one) the script doesn’t works
This is a fantastic idea; though my WMBC test implementation suggests it needs some tweaking, which is sadly beyond my skills.
* It doesn’t like links in captions
* The values on axes need to be rounded
* It would be good to be able to set a value other than zero, on either axis, for the start point.
* I want to show both the table, and the chart – in that order. How may I do that?
* The caption should wrap.
Twitter + voting/polling + Yahoo Pipes = TwEVS (The Making Of) – JISC CETIS MASHe
[…] information can be conveyed and interpreted quickly is by graphing it.Having previously used the Google Chart API I wanted to use this to create a graph of the data within the pipe. I found a couple of examples of […]
gEVS – An idea for a Google Form/Visualization mashup for electronic voting JISC CETIS MASHe
[…] my mashups, in fact all of my previous voting mashups use it in some way, and not surprisingly in Generating charts from accessible data tables using the Google Charts API.Google Chart works well if it easy for you to get the data and format it for the image URL. For […]
Comments are closed.