Pages

Advertisement

Thursday, July 5, 2007

Dynamic Javascript Chart Plotting With PlotKit

plotkit_20070418.jpg
PlotKit is a slick javascript library that allows you to easily generate line, bar, and pie charts with a few lines of javascript code. It supports rendering to both Canvas and SVG, so you can use it to add charting to your application and still be able to support a fair amount of browsers.

I'm glossing over some of the more advanced features, but check out how easy it is to generate a simple graph:


var data = [[0,0], [1,2], [2,3], [3, 7], [4, 8], [5, 6]];
var plotter = EasyPlot("line", {}, $("example"), [data]);

That will plot the values from the "data" array and display it in a div with the ID "example". Cool, no?

Charting from javascript is interesting, because it allows you to link in to data APIs that are provided by other services. There's a link below to a tool that will pull in data from a published Google Spreadsheet and generate the necessary javascript to display widget graphs on another site. It reminds me of how you can pull Excel graphs into a Word document, except javascript is the new, better OLE. With output tools like PlotKit, online services like Google Spreadsheets, and open data APIs in between, there are just so many possibilities now for creating information that can be shared in a variety of formats.

No comments: