JavaScript Chart Library?

There is a growing number of Open Source and commercial solutions for pure JavaScript charting that do not require Flash. In this response I will only present Open Source options.

There is a growing number of Open Source and commercial solutions for pure JavaScript charting that do not require Flash. In this response I will only present Open Source options. There are 2 main classes of JavaScript solutions for graphics that do not require Flash: Canvas-based, rendered in IE using ExplorerCanvas that in turns relies on VML SVG on standard-based browsers, rendered as VML in IE There are pros and cons of both approaches but for a charting library I would recommend the later because it is well integrated with DOM, allowing to manipulate charts elements with the DOM, and most importantly setting DOM events.By contrast Canvas charting libraries must reinvent the DOM wheel to manage events.

So unless you intend to build static graphs with no event handling, SVG/VML solutions should be better. For SVG/VML solutions there are many options, including: Dojox Charting, good if you use the Dojo toolkit already Raphael-based solutions Raphael is a very active, well maintained, and mature, open-source graphic library with very good cross-browser support including IE 6 to 8, Firefox, Opera, Safari, Chrome, and Konqueror. Raphael does not depend on any JavaScript framework and therefore can be used with Prototype, jQuery, Dojo, Mootools, etc... There are a number of charting libraries based on Raphael, including (but not limited to): gRaphael, an extension of the Raphael graphic library Ico, with an intuitive API based on a single function call to create complex charts Disclosure: I am the developer of one of the Ico forks on github.

6 This answer needs some lovin', it is the best in the bunch giving some criteria on what to look for instead of just naming some project. – elventear Feb 3 '10 at 16:54 1 Note that Ico has become Grafico: grafico.kilianvalkhof. Com – limist Nov 10 '10 at 14:38 3 Grafico and Ico are two incompatible forks of the initial Ico by Alex Young.So it is not accurate to state that Ico has become Grafico.

Grafico being just one of the forks. – Jean Vincent Dec 26 '10 at 21:12 It should be noted that Raphael appears to be no longer maintained. The last commit was July 2010 or so.

– Alastair Pitts Feb 25 at 1:28 Just downloaded raphael charts, liking it lots but no docs, just to forewarn. – Orbit Mar 14 at 0:20.

If you're using jQuery I've found flot to be very good - try out the examples to see if they suit your needs, but I've found them to do most of what I need for my current project. Additionally ExtJS 4.0 has introduced a great set of charts - very powerful, and is designed to work with live data.

2 This is the same library Geoff Dalgas used to create the reputation graph here on StackOverflow. It truly is a nice bit of kit. – Charles Roper Oct 2 '08 at 17:24 My only real complaint about flot is that when rendering in IE it looks terrible at any zoom level other then 100% (i.e.

All the lines/blocks don't scale together - this definitely a problem for those of us with high resolution displays). – Bittercoder Feb 3 '09 at 3:27 2 It looks like flot charts look nicer than many of the others I have looked at. Here's a link to 20 JavaScript chart libraries: javascript.

Open-libraries. Com/utilities/chart/… – B Seven May 20 at 15:07 I like flot too, have used this many times on different web apps before. – fedmich Aug 23 at 3:09 I like flot in general but it wants all data to be numbers, so if you want to plot something like sales per customer (by name) or per product it won't work – Zachary K Nov 24 at 10:34.

Check out highcharts.com! Ghcharts is a charting library written in pure JavaScript, offering an easy way of adding interactive charts to your web site or web application. Ghcharts currently supports line, spline, area, areaspline, column, bar, pie and scatter chart types.

8 Worth pointing out that this library is free for non-commercial use, but costs money for single-sites and multi-sites. It seems like a fairly reasonable price however. – Nick Spacek May 18 '10 at 18:08 3 seems a very professional library.

– Elzo Valugi Oct 22 '10 at 11:45 At first it as a shameless plug but they look REALLY awesome! It in not free fot commercial use though, I have no reference wether the pricing is reasonable or not but they look ok at a glance! – Trufa Dec 10 '10 at 12:07 6 damn this answer sounds like an advertisement – Aran Mulholland Jun 3 at 0:08 This is the same charting library used in CloudFlare.Com, and it looks really great.

I was about to use DevExpress charting library, which is ASP. NET and renders and image in the sever when I stumbled upon the highcharts library. I was convinced at once that this is the way to go.

When I found out that CloudFlare, which has one of the most eye-catching dashboards/analytic's I've seen, uses it too I was sold! I'm currently experimenting with it, and it worked in my first attempt to embed a chart in my webpage... so it seems easy to use too! – Loudenvier Aug 4 at 3:07.

It maybe not exactly what you are looking for, but Google's Chart API is pretty cool and easy to use.

1 This is a really good API. – Christian Davén Sep 23 '08 at 9:12 Just what I would have said – Keith Sep 23 '08 at 10:29 12 its not javascript – user102008 Sep 16 '10 at 23:10 1 just remember, Google Chart requires internet connection and also has some limits on the number of client requests allowed – fedmich Aug 23 at 3:08 @user102008: it is now :) (You can still access the old image based API if you want to) – Spycho Oct 12 at 10:17.

I saw some mentions of jqplot.com/ on the web, looks alright but I haven't used it.

I think so as well after doing some research. Right now it looks like one of the best free JS chart libraries available. – total Jul 8 '10 at 11:48.

I was recently looking for a javascript charting library and I evaluated a whole bunch before finally settling on jqplot which fit my requirements very well. As Jean Vincent's answer mentioned you are really choosing between canvas based and svg based solution. To my mind the major pros and cons were as follows.

The SVG based solutions like Raphael (and offshoots) are great if you want to construct highly dynamic/interactive charts. Or if you charting requirements are very much outside the norm (e.g. You want to create some sort of hybrid chart or you've come up with a new visualization that no-one else has thought of yet). The downside is the learning curve and the amount of code you will have to write.

You won't be banging out charts in a few minutes, be prepared to invest some real learning time and then to write a goodly amount of code to produce a relatively simple chart. If your charting requirements are reasonably standard, e.g. You want some line or bar graphs or perhaps a pie chart or two, with limited interactivity, then it is worth looking at canvas based solutions. There will be hardly any learning curve, you'll be able to get basic charts going within a few minutes, you won't need to write a lot of code, a few lines of basic javascript/jquery will be all you need.

Of course you will only be able to produce the specific types of charts that the library supports, usually limited to various flavors of line, bar, pie. The interactivity choices will be extremely limited, that is to say non-existent for many of the libraries out there, although some limited hover effects are possible with the better ones. I went with JQplot which is a canvas based solution since I only really needed some standard types of charts.

From my research and playing around with the various choices I found it to be reasonably full-featured (if you're only after the standard charts) and extremely easy to use, so I would recommend it if your requirements are similar.To summarize, simple and want charts now, then go with JQplot. Complex/different and not pressed for time then go with Raphael and friends.

There is another javascript library based on SVG. It is called Protovis and it comes from Stanford Visualization Group It also allows making nice interactive graphics and visualizations. vis.stanford.edu/protovis/ex/ Although it is only for modern web browsers UPDATE: The protovis team has moved to another library called d3.

Js (Data Drive "The Protovis team is now developing a new visualization library, D3. Js, with improved support for animation and interaction. D3 builds on many of the concepts in Protovis" The new library can now be found in: mbostock.github.com/d3.

Protovis is exactly what I'm looking for; allows very custom graphics, looks good, very powerful. The types of charts they can create are amazing. However, it doesn't yet work (well) in IE (none of the examples on the page work in IE8), so it's not an option for me.

But too bad - it looks amazing. One word of warning - the usage for protovis takes a lot of getting used to. Take a look at the examples.

– Rocketmonkeys Jun 28 at 15:42 2 It seems that it was replaced by D3. – Cristian Ciupitu Jul 11 at 17:05 Based on a quick look, I don't think D3 "replaces" Protovis. I would say that the team "moved on" because they see it as more interesting and cutting edge.

– David James Aug 2 at 2:38.

Flotr is another, pure Javascript chart-library based on Prototype and inspired by Flot.

A framework: simile-widgets.org/ a basic: filamentgroup.com/examples/charting_v2/i... good looking: highcharts.com.

For displaying large datasets, I would take a look at chronoscope ( timepedia.org/chronoscope/ ). It can be used as pure javascript, or integrated into a gwt app too. Or, try the MIT simile timeline which could be made into a chart - simile.mit.edu/timeline/ or the final one, code.google.com/p/gchart.

There is a lot of activity in the dojo charting library, and what is great I am using it inside an AIR application without problems too, pretty cool! See for example there sitepen.com/blog/2008/05/27/dojo-chartin....

Check out Google Visualization API, which is kind of a generalization of the simpler Chart API.

I'd recommend gRaphaël for pure JavaScript charting along with the pure JavaScript vector graphics library it's built on (Raphaël). GRaphaël currently supports Firefox 3.0+, Safari 3.0+, Opera 9.5+ and Internet Explorer 6.0+.

1 just want to give the heads up that there are no docs for this lib, although it is very nice. – Orbit Mar 14 at 0:20.

code.google.com/apis/visualization/docum... Has very cool interactive options including maps, gauges, and charts.

Not a Javascript library but it may be a suitable alternative - check out Google Charts where you can generate charts by passing querystring data to their web service.

My favourite (flot) has already been mentioned. But be sure to investigate Ortho. It is excellent for tree charts and timelines.

Take a look at Bluff. It's a JavaScript port of the Gruff graphing library for Ruby.

2 Provide real link O. O – pst Dec 22 '10 at 8:36.

Sencha acquired Raphael and now their charts are pure javascript as of version 4. Emprise and ghCharts mentioned above are my two favorites. sencha.com.

For the more unusual charts: thejit.org.

Another is RGraph: Javascript charts and graph library: rgraph.net Canvas based so it's fast and there's roughly 20 different chart types. It's free for non-commercial use too!

Check out ZingChart HTML5 Canvas, SVG, VML and Flash Charts. Very powerful and compatible library. I'm on the Zing team - mention us on twitter @zingchart or shoot any questions to [email protected].

Thanks, Andrew.

I can recommend ArcadiaCharts. A brand-new professional charting library for JavaScript and GWT. Runs in all browsers without plugins.

Easy and fast to use: creates great looking charts with just a few lines of code. Free for non-commercial use.

Fusion charts has a new javascript/jquery library that looks promising.

In case what you need is bar chart only. I published some code I've been using in an old project. Someone told me the VML implementation is broken on recent versions of IE, but the SVG should work just fine.

Might be getting back to the project and release some serverside renderers I already have and maybe WebGL rendering layer. There's a link: blog.conquex.com/?p=64.

You can try Visifire Chart. The below is the documentation links on how to create Visifire chart using JavaScript. visifire.com/documentation/Visifire_Docu... visifire.com/documentation/Visifire_Docu... visifire.com/documentation/Visifire_Docu... visifire.com/documentation/Visifire_Docu... visifire.com/documentation/Visifire_Docu....

I'd suggest amCharts. It used to be flash charts but now they have pure JavaScript charts, scrollable, zoomable, 3d, etc...

I cant really gove you an answer,but what I can give you is a way to a solution, that is you have to find the anglde that you relate to or peaks your interest. A good paper is one that people get drawn into because it reaches them ln some way.As for me WW11 to me, I think of the holocaust and the effect it had on the survivors, their families and those who stood by and did nothing until it was too late.