Monday 19 November 2012

Speed comparison of JavaScript charting libraries


Choosing a charting component for any organization is a complex task because the selection will have to be made considering both the present and future needs of the organization. It requires a careful evaluation of requirements.
In this section, I have compared some of the popular charting components suitable for hybrid app development –


S No
Description
Charts
Advantage
Remark/Comment
1
Using <div> tag as placeholder for charts helps developer to adjust height/width eaisly into the HTML page
amCharts
  
Uses <div> tag
Highcharts
  
Uses <div> tag
RGraph

Uses <canvas> tag
Flot
  
Uses <div> tag
ZingCharts

Uses <canvas> tag
2
<div> tag is supported by all browsers whaeras <canvas> is a new HTML standard.
amCharts
  
All browser support
Highcharts
  
All browser support
RGraph

Only supported by HTML5 compliance browsers
Flot
  
All browser support
ZingCharts

Only supported by HTML5 compliance browsers
3
SVG scene graph is a old and stable way to represent graph/chart. SVG is like a "draw" program whereas HTML5 is a "paint" program and is a new concept.
amCharts
  
Uses SVG scene graph
Highcharts
  
Uses SVG scene graph
RGraph

Uses HTML5 Canvas
Flot

Unknown
ZingCharts

Uses HTML5 Canvas
4
Can eaisly change according to the landscape/potrait orientation of the device.
amCharts
  

Highcharts
  

RGraph

Difficult to achieve this functionality in RGraph
Flot


ZingCharts


5
Enables event handlers to be associated with objects
amCharts
  

Highcharts
  

RGraph

Not possible
Flot

Unknown
ZingCharts

Unknown
6
Includes meter charts
amCharts

Meter charts not supported
Highcharts
  

RGraph
  

Flot

Meter charts not supported
ZingCharts

Unknown
7
High quality.Nice visually.
amCharts
  

Highcharts


RGraph


Flot


ZingCharts
  

8
3D Charts
amCharts
  

Highcharts


RGraph


Flot


ZingCharts
  

9
Good Documentation and Online Support
amCharts
  

Highcharts
  

RGraph
  

Flot

Limited Support & documentation
ZingCharts
  

10
Build chart online with the help of Chart builder
amCharts


Highcharts


RGraph


Flot


ZingCharts
  


From the above comparisons it is quite obvious that each charting tool has its pros and cons. But, as per my view there is a competition between Highcharts and amCharts.
When I started with charting I found amCharts to be more documented and user friendly than Highchart, but if you check on the net, there is huge fan base for Highchart!
Think twice if you want meter charts, amCharts do not support meter charts and is a big disadvantage in this area. If you are looking for visuals, amCharts are smooth and nice with 3D chart support.

Reference links -
https://developers.google.com/chart/interactive/docs/gallery/controls#programmatic_change
http://bimeanalytics.com/blog/which-chart/

2 comments:

  1. Below are the URLs -

    amCharts http://www.amcharts.com/
    Highcharts http://www.highcharts.com/
    RGraph http://www.rgraph.net/
    Flot http://www.flotcharts.org/
    ZingCharts http://www.zingchart.com

    ReplyDelete
  2. New addition. Probably a good replacement for other charting tools.
    http://www.chartjs.org/

    ReplyDelete