Progressive Charts

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 technique accessible. Back then, I was thinking about CSS and wanted to try my hand at unobtrusive 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 popularize the slant technique) 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 inspiration 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 accessible as a plug-in to jQuery or other popular libraries.