At work I’ve ran into a bit of a problem when using the Google chart tools gauge visualisation. For some reason the VML (IE’s version of Canvas / SVG) is being output but not showing, resulting in a big blank space where the gauge appears in other browsers. Now I’ve written the code for around 20 different gauges and I’m not in the mood to adapt my code drastically for yet another library so I had to look for a solution. I found one, well hidden away in the annals of the internet called jsgauge. This plugin allows you to keep your options from your Google chart gauges, strip out most of the data table stuff and renders the gauge via a Canvas tag (which is really great considering Explorer Canvas works really well.

Changes that need to be made

Below are two markups, the first is the original Google Chart tools markup and the second is the adaptation for the plugin. As you can see the data table is no longer there, and the options are the same, a few things have changed. Most importantly though the div tag has changed to a canvas tag (when first using the plugin I forgot and spent 30 mins debugging to see if there was issues with other libraries!).