hans.gerwitz

Progressive charts

Posted on April 12th, 2009

Back in 2001 Tantek Çelik dreamt up a little polygonal CSS hack, using the bevels of borders to create angles in-​​browser. Eventually, Lasse Reichstein Nielsen made the tech­nique acces­sible. Back then, I was thinking about CSS and wanted to try my hand at unob­trusive DHTML.

So I was inspired to implement simple rendering of HTML lists as area charts. Naturally, once it mostly worked I lost interest, and let it rest assuming someone would have the same idea and take it much farther.

But as far as I can call, no one has. Now Eric Meyer (who helped popu­larize the slant tech­nique) brought it to mind again with his CSS bar charts (granted, without resorting to scripting).

So after letting the code age for 6 years, it’s time to put it out there and hope it provides inspi­ration to others. An example and project are on GitHub, all are welcome to join or fork. I’d love to see it extended to handle tables, added to a library that turns unordered lists into bar charts, or at least made acces­sible as a plug-​​in to jQuery or other popular libraries.

View Comments to “Progressive charts”

  1. Will Says:
    Very cool, I love how clean it is.

Leave a Reply

blog comments powered by Disqus