Review about web charting tools
Sometimes you need to draw charts on your website. Charts look more elegant than tabular raw data. Searching for "chart ruby" in Google will return thousands of results. I did a 1-to-2-days investigation to compare most popular and rich solutions. Here are comparison results...
My goal was to select an interactive charting tool that is easily embeded in a Rails application. The library should have many features like Zoom in/out, auto-scale and logarithmic scales. It should also be able to handle large sets of data, thousands I say.
I was hoping to find one that is free so that I don't pay for getting it!
First column in the table is library name. Input method means how data is fed into the library, programatically means using arrays, other accept XML or CSV files. Due to the fact that data is already available in unprocessed CSV format, CSV method will be the least overhead method.
Libraries are categorized into 2 categories, first one renders on the server-side and a final image is transfered to the client browser. Gruff and ChartDirector are examples. The other category relies on Flash technology to transfer data files along with the SWF renderer to the client. The client machine processes data and renders it client-side.
The main advantage of server-side rendering is that performance can be optimized by deploying on a very efficient server and clients can be thin poor clients. However, interaction with user will be void in the case of Gruff and limited in the case of ChartDirector.
The second category has the advantage of high interactivity with user. User can zoom, pan, change colors and fonts instantly using Flash capabilities. ChartDirector implements interactivity by transfering both a PNG image to the client along with an image map. When users move the mouse pointer over the generated image, and accordingly over the image map, events are fired so that interaction can take place using Javascript. However, for zooming and scaling actions, AJAX calls should be done to the server to get different images.
Now comes the most important part of the comparison, performance. I had to download, install and test libraries to benchmark them. Due to limited time, I selected 2 of them having more features, plus 2 coded earlier by Hatem. I prepared datasets having 500, 1000, 2000, 5000 and 7000 records each. Values in the table shows average running time (total request time + rendering time) in seconds when feeding 2000 records for 4 consequitive experiments.
Out of the 4 libraries, amCharts proved to be fastest, only 4.5 average time. OpenFlash took a lot of time (sometimes 40~50 seconds) during which Firefox warned me that the Adobe Flash player is taking too much time and asked if I want to abort it.
Having all features I was hoping for, being the fastest, and above all being free, my decision came up to amCharts.
| Name | Input data format | Output format | License | Performance | Zoom in/out | Log-scale | sub-plots | Interaction | Animation | Ruby wrapper |
| ChartDirector | programmatically | PNG | Evaluation copy | 15 | Yes | Yes | No | Javascript/AJAX | No | Yes |
| maani.us | XML | SWF | Free (ad click) | ? | No | No | No | Flash | Yes | No |
| Fusion Charts | XML | SWF | Free (limited features) | ? | No | Non-free | Yes | Flash | Yes | PHP examples |
| Open Flash Chart | programmatically | SWF | Open source | 35 | No | No | Yes | Flash | Yes | Yes |
| amCharts | CSV/XML | SWF | Free (ad link, 85€) | 4.5 | Yes | Yes | Yes | Javascript/Flash | Yes | Rails examples |
| Gruff | programmatically | PNG | Free (Ruby License) | 21 | No | No | No | None | No | Yes |
My goal was to select an interactive charting tool that is easily embeded in a Rails application. The library should have many features like Zoom in/out, auto-scale and logarithmic scales. It should also be able to handle large sets of data, thousands I say.
I was hoping to find one that is free so that I don't pay for getting it!
First column in the table is library name. Input method means how data is fed into the library, programatically means using arrays, other accept XML or CSV files. Due to the fact that data is already available in unprocessed CSV format, CSV method will be the least overhead method.
Libraries are categorized into 2 categories, first one renders on the server-side and a final image is transfered to the client browser. Gruff and ChartDirector are examples. The other category relies on Flash technology to transfer data files along with the SWF renderer to the client. The client machine processes data and renders it client-side.
The main advantage of server-side rendering is that performance can be optimized by deploying on a very efficient server and clients can be thin poor clients. However, interaction with user will be void in the case of Gruff and limited in the case of ChartDirector.
The second category has the advantage of high interactivity with user. User can zoom, pan, change colors and fonts instantly using Flash capabilities. ChartDirector implements interactivity by transfering both a PNG image to the client along with an image map. When users move the mouse pointer over the generated image, and accordingly over the image map, events are fired so that interaction can take place using Javascript. However, for zooming and scaling actions, AJAX calls should be done to the server to get different images.
Now comes the most important part of the comparison, performance. I had to download, install and test libraries to benchmark them. Due to limited time, I selected 2 of them having more features, plus 2 coded earlier by Hatem. I prepared datasets having 500, 1000, 2000, 5000 and 7000 records each. Values in the table shows average running time (total request time + rendering time) in seconds when feeding 2000 records for 4 consequitive experiments.
Out of the 4 libraries, amCharts proved to be fastest, only 4.5 average time. OpenFlash took a lot of time (sometimes 40~50 seconds) during which Firefox warned me that the Adobe Flash player is taking too much time and asked if I want to abort it.
Having all features I was hoping for, being the fastest, and above all being free, my decision came up to amCharts.