by Rick Glos
30. January 2008 21:57
Google has introduced a way to dynamically create charts by using a url. As an example, here's my bicycle mileage by week for the month of January.
If you right click the image on the right you'll see that's it's not a static image by looking at the properties (right-click the image and select Properties).
What's that mean? Well if you navigate to Google's homepage and check the properties of their image you'll see it links directly to a file called logo.gif, whereas the image above does not link to a file at all, it's generated each time the page is accessed.
It gets all the information needed to render the image from the garbage you see after the question mark: http://chart.apis.google.com/chart?cht=p3&chd=s:hW&chs=250x100&chl=Hello|World.
To get an idea of how it works and what's possible I graphed my cycling mileage.
What I needed first was to aggregate the data. If I look at the mileage log that I keep in Microsoft Excel it looks something like this:
| Date |
Mileage |
| 2008.01.15 |
19 |
| 2008.01.16 |
30 |
| 2008.01.22 |
25 |
| 2008.01.24 |
25 |
| 2008.01.28 |
23 |
| 2008.01.30 |
23 |
Using a pivot table we can quickly summarize this data:
| Week Number |
Mileage |
| Week 1 |
0 |
| Week 2 |
0 |
| Week 3 |
49 |
| Week 4 |
50 |
| Week 5 |
48 |
Now we need to put that into a format that the Google Chart API can handle.
Here's a breakdown of the long url needed to create the image above:
| http://chart.apis.google.com/chart? |
this is the API endpoint |
| chs=300x200 |
create a chart 300 pixels wide by 200 pixels tall |
| &chd=t:0,0,49,50,48 |
chart data for the 5 weeks |
| &cht=lc |
line chart (vs pie, bar, venn, and scatter) |
| &chxt=x,y,x,x |
multiple chart axis |
| &chxl= |
labels |
| 0:|Week+1|Week+2|Week+3|Week+4|Week+5| |
labels for the 1st x axis |
| 1:||25|50|75|100 |
labels for the only y axis |
| 2:|Jan| |
label for the 2nd x axis |
| 3:|2008| |
label for the 3rd x axis |
| &chtt=2008+Bicycle+Mileage |
chart title |
| &chm=B,FFE4BB,0,0,0 |
chart fill color |
| &chxp=1,0,25,50,75,100 |
y axis label positions |
It looks like alot of work and it was at first. You could get better hacking this out over time but you'd definitely want a some kind of method that would start with the data and just emit the url.
Currently there's a limit of 50,000 queries per day per user. It would take alot of hits to max that out, and this blog doesn't have that kind of traffic. It is a good tool for creating an image of a chart. They state that it was created to, "support rapid embedding of charts within our own applications". I'm not sure how rapid this is compared to whipping it up in Excel and saving the image as a file for the average user. A developer could get some mileage out of this but the 50,000 day limit would be something to consider.
You can find all the documentation for the API here. As a proof of concept I may try and update the graph weekly or monthly and see how it goes.
Later.
c69fe360-38af-43cb-ac94-1c0ac62800fb|0|.0
Tags: programming
Subscribe