8 awesome plug in to Generate Chart/Graph in Web Application

• Tweet

• Tweet

The old days of displaying statistics  using HTML Tables   is now over. Nowadays, the need for an easy way to add interactive charts has become important. Graph/Chart allows end users to visualize data view, trends and also “wow” your visitors. Below is a list of Graph Components/Libraries that I have compiled that you can use in your project. Some are flash-based others, are in Javascript.  With these Chart Components, you can easily generate charts in your web application such as Pie Chart,  Bar Chart,  Line Graph and much more.

Flash-based Chart Components

Flash-Based Graph components  provide interactive options that simple image based charting components do not offer.  It is not a problem at all, if you are not a flash coder because flash based charting usually uses XML as a Data Interface.  So all you need to know is how to convert your data into XML Format.

1. FusionCharts

Fusioncharts provides stunning free flash components that you can add in your web application.  I have personally used this , and I believe it is one of the best out there. It does not even have a watermark on it unlike other flash chart tools.  This website also provides paid chart components if you are looking for additional features .

Type of Charts: 3D/2D Column & Bar Charts ,Line Charts,2D/3D Pie & Doughnut Charts,Area Charts,Stacked Charts,Combination Charts,Candlestick Charts,Funnel Chart,Gantt Chart
Demo/Download : http://www.fusioncharts.com/free/
License Type : MIT and GPL licenses



Fusionchart component

2. Open Flash Chart

This charting Flash Component uses JSON as Data file format.  Implementation is quite straight. All you have to do is copy the Open Flash Chart SWF file to your server, then start embedding flash charts into your HTML and point to static or dynamic data on your server .Some of the of the key features include exporting of the chart into an image, it also supports tool tip to encourage interactivity. Moreover, it provides libraries to generate graph in programming languages other than PHP ( Java,  .Net,  Python,  Ruby ) .

Type of Charts: Glass Bar Chart,Area Chart,3D Bar Chart,Data Lines,Pie Chart
Demo/Download : Version 2
License Type :GNU General Public License.



Open Flash Chart

3. XML/SWF Charts

XML/SWF Charts is a simple, yet powerful tool to create attractive charts and graphs from XML data.

Type of Charts: Line,Column,Stacked column,Floating column,3D column,Image column,Stacked 3D column,Parallel 3D column,Pie,3D Pie,Image Pie,Donut,Bar,Stacked bar,Floating bar,Area,Stacked area,3D Area,3D Stacked area,Candlestick,Scatter,Polar,Bubble,Composite,Mixed,Joined
Demo/Download : http://www.maani.us/xml_charts/
License Type : Dual License



xml/swf Component

Javascript-Based Chart Components

4. Highcharts

Highcharts is probably one of the most popular JavaScript based charting components on the web. It Works on all major browsers and on even ipad/ipod/iphone.This plug In stands from the crowd because of some extra features that is not available in other components such as exporting the chart in pdf,jpg,png format, zooming capabilities, etc .

Type of Charts: line, spline, area, areaspline, column, bar, pie and scatter chart types.
Demo/Download : HighCharts Demo
License Type : Free for Non-Commercial Use



HighChart Plug in

5. jQuery Visualize
   

As the name tells you,  it is a jQuery Based Plug in that allows you to visualize data. This plug in also uses HTML5 canvas to dynamically generate an image for the Graph.

Type of Charts: Line graph,Bar Chart,Pie Chart .
Demo/Download : FilamentGroup

License Type : Free To use



Jquery Visualize Plug In

6. Flot

Flot is another great Plug in to generate attractive graph .Some key features include zooming capabilities , Tooltip . However , it currently supports only 4 different type of chart/graph .

Type of Charts: lines, points, filled areas, bar Chart .
Demo/Download : Flot Graph
License Type : MIT License



Flot Plug in

7. jQuery Sparklines

Sparklines generates small charts either inline in the HTML or via JavaScript. You can generate a graph with only 1 line of HTML or Javascript code. This plug in also has auto refreshing capabilities. On the official website, you can see a demo of a live graph of your mouse speed. However,  I don’t find it really attractive.

Type of Charts: line graphs,Composite inline,Composite bar,Box Plot,Pie charts,Bullet charts
Demo/Download : SparkLines
License Type : MIT License



Sparklines Plug in

8. jqPlot

jqPlot is another great plotting and charting plug in based on jQuery that is comparable to the key features of HighCharts. This plug in allows the end user to drag and drop the lines, and it automatically redraws itself.

Type of Charts: Bar, Pie & Line Chart .
Demo/Download : jqPlot Graph
License Type : MIT and GPL



Jqplot Plugin

Summary

As you may have seen, each of these graph components can be used to generate a different type of chart that suits your need. Most of the developers will probably prefer one which has many features, attractive, easy to use, without getting a headache with browser compatibility issues and most of all, one which is free.

In my opinion,if you are opting for a flash-based component, FusionChart is the best one and if you prefer  Javascript -based ,then HighCharts is the best one to go with. If you know any other good free charting components that you have used, feel free to share it with us in the comment section below :)

Related Posts

1. Dynamically Generate PDF Files In PHP

Tagged as: Chart Components PHP, Generate Chart, Generate Graph, jQuery Graph