Showing posts from March, 2012

jqPlot Bar Chart value-based colours

jqPlot is an excellent, easy to use, javascript library for generating dynamic charts. I found it very easy to create just the right type of bar-charts that I was looking for, with the exception that it does not support any method to select bar colours based on their data values. That is, suppose you want all bars less than X to be red, all less than Y to be yellow and all others to be green. There is no way to do this via option parameters. So to implement the functionality, requires hacking of the supplied jqPlot files.

First, open jquery.jqplot.js and search for $.jqplot.ColorGenerator = function(colors) { ...
In here, modify = function() = function(val, max). This method is called by every plugin rendered to get the colour for each data point.

So we now need to open up the chart rendered and pass these values in. For Bar Charts, open up the jqplot.barRendered.js file and search for You will find 4 instances of this. Change the first two…