If you have tried to do a decent chart or graph or any line drawings in HTML/CSS you would have felt extremely frustrated, more so you want it to be cross-browser compatible. Though SVG and VML have been around for years, the support for them is not uniform between browsers. Recently in a newsletter from Sitepoint I came across Raphaël – a small JavaScript library (less than 19Kb in filesize) written by Dmitry Baranovskiy of Atlassian, that allows you to create and manipulate vector graphics in your web pages. It’s simple to use and supports Internet Explorer 6.0+, Safari 3.0+, Firefox 3.0+, and Opera 9.5+. Internally Raphaël uses VML in IE and SVG in the other browsers.

Raphaël is published under MIT License which basically allows you to use the code in both commercial and non-commercials applications and even redistribute freely (as in free beer).


To do the above graph, you need to write only 30 lines of Javascript. Check it out.

Categorized in:

Tagged in: