What to use to create bar, line and pie charts with javascript compatible with all major browsers?

Question

I used to work with flot but it doesn't support pie charts so I'm forced to change.

I just saw JS Charts, but their documentation is very obscure regarding cross browser compatibility (I need it to be IE6+ compliant :). Also this will be for commercial use, so I'd rather have something that I can use free of charge

jQuery Google chart looks really nice and is well integrated with rails (the framework I'm using) but I'm not sure how good it is.

So what do you guys use? What would you recommend keeping in mind that:

• It will be for commercial use (I can deal with a license, but I'd rather avoid that)

• It needs to be javascript (no svg, no flash please)

• It needs to be compatible with IE6+, FF, Chrome, Opera and Safari

• It needs to be pretty ^^

• If it uses jQuery it's even better

Answer 1

Just a few days ago I was exploring on this and I found http://bluff.jcoglan.com/ Bluff.

It has a simple API and is cross browser compatible. The only drawback is that it uses the $ namespace and thus will conflict with many major JS frameworks such as jQuery. My workaround was to use jQuery.noConflict.

Answer 2

Maybe http://code.google.com/apis/chart/ can do what you need.

Answer 3

Most of the JavaScript based charting frameworks rely on Canvas which is not supported by IE. There are ways to make it work (excanvas), though.

I would suggest you stay away from JavaScript based frameworks unless you need to dynamically update or animate the chart. For everything else, server-side generated graphs are easier to implement, less of a hassle and you can find more pretty options.

I've had good luck with the Google Charting API that you've been referring to. It is quite extensive, can produce a great variety of plots. It's also very flexible when it comes to styles and colours, so it's easy to match a corporate style with it. One downside is, that it is sometimes too complex for what you might need. I especially had trouble getting my head around the axis scaling and labeling, but once you figure it out it's very powerful. I certainly would recommend this if you don't have problems with relying on a third party and don't need dynamic graphs. There is a jQuery plugin for it but I doubt you will need it if you can use a rails library.

Another charting framework that I've been using is jFreeChart (http://www.jfree.org/jfreechart/). It's Java based and open source. The graphs are reasonably pretty and has many different graph types. The Java API is extensive, but the documentation is not the best. You can buy the book from them though. At my company we built a fairly simple wrapper around it, that allows us to send XML formatted data to it and get a chart back, making it compatible with pretty much every language.

Answer 4

Try this Jquery Visualize plugin

Another one interesting article 10-best-free-javascript-charts-solutions

Answer 5

I'm recommend a Raphaël—JavaScript Library.

Here is example with pie chart: http://raphaeljs.com/pie.html

currently supports by Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.