gRaphael Js: where can I find tutorials to produce data charts (pie, bar, etc)

Question

Where can I find tutorials to produce data representations on the web with gRaphael? There seem to be no documentation on line.

Many Thanks

Answer 1

I really would recommend against graphael just from personal experience. I looked at it and got stuck several times during my implementation (ex, simple things like axis labels require hacks like setting text at specific spots), and the physical x-axis scaling/ticks that is visible (at least for bar charts that I've tried) don't seem related to the data, as if there is some internal axis that you can't see. I could not find a single graph example that actually had even the minimum # of components a professional graph has (labels, legends, etc), so for me it's just a prettier 'sparklines'. All in all, a lot more trouble than it's worth, plus any documentation you find will be minimal at best.

I would look into jquery options (great documentation and easy browser support for js)

1. highcharts is #1 if it's for personal use, very beautiful, interactive, and easy to use
2. flot, nice looking though not as interactive or as many options
3. jqplot, inspired by flot. this is my current choice. there's a huge amount of stuff you can do with this. interactive and professional looking, looks like a good sub for highcharts if the licensing fee is too much.

Flash charts (beautiful but flash is a no-no these days):

1. Open flash charts - It's not too bad to implement and I used it before I decided to switch to jqplot. Very nice looking charts, but my graphs needed to grab data from the server more dynamically, and I decided js was a better option to do it.
2. Amcharts - easily make good looking graphs via XML data.

Answer 2

There doesn't seem to be that many beginner tutorials, but here's a couple of reasonably introductory text with examples:

http://www.treutech.com/42/visualizing-data-jqplot-graphael, http://articles.sitepoint.com/article/graphael-javascript-graphs, http://blog.jeremi.info/entry/creating-a-chart-with-raphael-js-from-a-google-spreadsheet