Adding charts to web-based applications is a common requirement. There are quite a few products on the market which can meet a variety of charting needs. This post discusses what to consider when selecting such tool and highlights several top product options.
Selecting a charting tool
When selecting a chart library, start by defining your selection criteria taking into account the following considerations:
Feature Considerations
- Most libraries include common charts such as line, bar, pie, area, scatter. Some support other chart types such as maps, dashboard meters and gauges, tree maps etc.
- Some products support combination charts, i.e. ability to mix different charts together.
- Esthetically some products may be more appealing than others. Products also differ in a level of look and feel customization.
- Products vary in level of interactivity. Some support zoom, drill down, drag and drop capabilities.
- Some products include real-time support, i.e. data feed integration.
Technology Considerations
- Libraries render charts using Flash, HTML5 canvas, SVG or VML. Non-Flash solutions are typically referred to as JavaScript.
- Some libraries support a limited set of browsers. This is not an issue for Flash based solutions. Flash is however problematic with some devices.
- Libraries differ in weight they add to a page. They also differ in ability to handle larger volumes of data.
- Integration in some cases involves literally adding a few lines of code. Other, framework type products may require extensive coding.
- Pretty much all products, including commercial, provide access to the source code.
Vendor Considerations
- Products vary from research projects to commercial solutions. Some open source products are actively maintained while other projects may be getting only sporadic attention.
- There are bleeding edge options and mature, widely used products.
- There are free products and paid for commercial solutions.
- Some vendors offer support.
From a bigger picture perspective, selecting a chart tool is not a major decision and hence the process does not need to be over-engineered. It is however worthwhile to outline:
- your key functional requirements, e.g. type of charts you would like to render
- technical requirements such as performance and browsers/devices to be supported
- any vendor preferences, product maturity level in particular
There isn’t a single answer for everybody. There are however a few leading contenders who would fit a broad range of circumstances.
Top products
FusionCharts
It is probably the most comprehensive solution on the market. FusionCharts includes a wide variety of charts, graphs, maps, visualization widgets and gauges. It is widely used. Originally the product was Flash based. JavaScript support has been added. There is one downside – it is more pricy than other options.
ZingChart
ZingChart includes a wide variety of charts. Vendor highlights performance and support for large data sets. Flash, HTML5, SVG and VML renders are available. Pricing can be found here.
Highcharts
Highcharts is a robust, mature JavaScript charting solution. All common charts are supported. It is free for noncommercial and inexpensive for commercial use.
jqPlot
jqPlot is a free jQuery plotting plugin. It renders commonly used charts and its key strength is ease of integration for anybody already using jQuery.
jQuery Sparklines
This free plugin generates sparklines (small inline charts).
InfoVis
InfoVis is a free JavaScript data visualization toolkit. It focuses in particular on visualization of tree and graph data.
Google Chart Tool
Google Chart is a free JavaScript charting tool. It is a SaaS solution. With most other options you download and deploy charting libraries with your application. With Google Chart you render charts by making calls to Google servers.
Personal Perspective
At my prior startup we used FusionCharts and we have been very happy with the product. An example is included in my Social Media CMO Summary Dashboard post. I would not hesitate to recommend it and my initial inclination was just to go with FusionCharts again at my current startup. It has been however a while since I looked at chart libraries and we are being careful with investors money. Hence I decided to look at the products again. Open source solutions was our preference. We ended up settling on Highcharts which functionally offers everything we need at this time. It is JavaScript based and the trend is towards JavaScript based solutions. It is mature (we do not want to spend time fixing bugs in a chart library). While not free it is very modestly priced.
Robert Tekiela
CTO Insights 
How can you not have FLOT?
Thanks for the include of http://www.zingchart.com. I’m on the team – can be reached at abegin[at]zingchart.com with any questions!
You may also look at dhtmlxChart, a cross-browser JavaScript charting library based on Canvas. It supports the common chart types: line, bar, area, pie, radar, and scatter charts. Distributed under GPL v2 (for proprietary projects a commercial license is required, $99 for all of your sites).
Demos: http://www.dhtmlx.com/docs/products/dhtmlxChart/index.shtml
Hey! Would you mind if I share your blog with my myspace group?
There’s a lot of people that I think would really appreciate your content. Please let me know. Many thanks
Of course I would not mind. Please feel free to share.
Great article, I particularly liked the points under ‘Feature Considerations’ and ‘Technology Considerations’.
http://www.FusionCharts.com gets my vote. It has great variety in chart types, and is a robust offering, especially when stacked against the feature & tech considerations you mention.
I would suggest javascript amCharts: http://www.amcharts.com
Please take a look – AnyChart http://www.anychart.com
VanCharts(http://www.vancharts.com/) will be another good choice. It supports gantt chart,and aside from JS chart library, VanCharts also supplies iOS and Android native charts library for users.