25 Graph & Chart Solutions For Web Developers

Graphs and Charts for Web DevelopersWe have compiled 25 solutions for displaying data visually with charts and graphs using various languages. PHP, Flash, JavaScript (jQuery, MooTools, Prototype) and CSS can all be utilized successfully to implement interactive data visualizations. There are many techniques & solutions from each that will allow you to display them on web pages and web applications.

PlotKit – Javascript Chart Plotting

PlotKit is a Chart and Graph Plotting Library for JavaScript that has support for HTML Canvas and also SVG via Adobe SVG Viewer and native browser support. It is based on top of the HTML CANVAS tag which is supported in Firefox, Safari and Opera, and is available under emulation on IE6 and IE7 via the ExplorerCanvas.

http://www.liquidx.net/plotkit/

jQuery Visualize Plugin – Accessible Charts & Graphs

The jQuery Visualize Plug-in makes use of the Canvas element of HTML5 to give you a simple and accessible method for generating bar, line, area, and pie charts from data contained within an HTML table and allows you to configure them in a variety of ways.

http://www.filamentgroup.com/lab/jquery_visualize_plugin_accessible_charts_graphs_from_tables_html5_canvas/

jqPlot Charts and Graphs for jQuery

The feature rich jqPlot is a plotting and charting plug-in for the jQuery JavaScript framework. There are plenty of hooks into the core jqPlot code allowing for custom event handlers, creation of new plot types and adding canvases to the plot.

http://www.jqplot.com/

Protovis – A graphical approach to visualization

Unlike low-level graphics libraries, Protovis, defines marks through dynamic properties that encode data, allowing inheritance, scales and layouts to create data with simple marks such as bars and dots to simplify construction.

It uses JavaScript and SVG for web-native visualizations; no plugin is required (though you will need a modern web browser) and programming experience is helpful but not essential. It does have extensive documentation and a wide array of examples on its homepage to help you get started.

http://vis.stanford.edu/protovis/

jQuery Sparklines

This jQuery plug-in generates sparklines (small inline charts) directly in the browser using data supplied either inline in the HTML, or via JavaScript all with a single line of code.

The plug-in is compatible with most modern browsers and has been tested with Firefox 2+, Safari 3+, Opera 9, Google Chrome and Internet Explorer 6, 7 & 8.

http://www.omnipotent.net/jquery.sparkline/

MilkChart – Graph/Chart library for MooTools

MilkChart is a simple to use, yet robust library for transforming table data into a chart. This library uses the HTML5 tag and is only supported on browsers other than IE until ExCanvas gets proper text support.

http://code.google.com/p/milkchart/

mooCSSChart

With mooCSSChart you can easily create animated bar charts.

http://www.artness.de/moo/

Highcharts – Interactive JavaScript charts for your webpage

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

It works in all modern browsers including the iPhone and Internet Explorer from version 6. Standard browsers use the Canvas element and in some cases SVG for the graphics rendering. In Internet Explorer graphics are drawn using VML.

http://www.highcharts.com/

JS Charts – Free JavaScript charts

JS Charts is a JavaScript chart generator that requires little or no coding. JS Charts allows you to easily create charts in different templates like bar charts, pie charts or simple line graphs.

With JS Charts drawing charts is a simple and easy task, since you only have to use client-side scripting (i.e. performed by your web browser). No additional plugins or server modules are required, just include the scripts, prepare your chart data in XML or JavaScript Array and your chart is ready.

http://www.jscharts.com/home

Flot – Attractive JavaScript plotting for jQuery

Flot is a pure JavaScript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side. It has been developed with focus on simple usage (all settings are optional), attractive looks and interactive features like zooming and mouse tracking.

The plug-in works with Internet Explorer 6/7/8, Firefox 2.x+, Safari 3.0+, Opera 9.5+ and Konqueror 4.x+ with the HTML canvas tag (Internet Explorer where the ExCanvas JavaScript emulation helper is used).

http://code.google.com/p/flot/

Flotr Javascript Plotting Library

Flotr is a JavaScript plotting library based on the Prototype JavaScript Framework and has been inspired by Flot (above).

Flotr enables you to draw appealing graphs in most modern browsers with an easy to learn syntax. It comes with great features like legend support, negative value support, mouse tracking, selection support, zoom support, event hooks, CSS styling support and much more.

http://solutoire.com/flotr/

Libchart – Simple PHP Chart Drawing Library

Libchart is an easy to use, free chart creation PHP library. The new version features multiple datasets for horizontal, vertical bar charts and line charts.

http://naku.dohcrew.com/libchart/pages/introduction/

pChart – a PHP Charting library

pChart is a PHP class oriented framework designed to create aliased charts with its data easily retrieved from SQL queries, CSV files, or manually provided. In this version rendering speeds have been greatly improved and run pChart on your web server, you’ll need to use PHP compiled with the GD library support.

http://pchart.sourceforge.net/

YUI 2: SWF Charts

The YUI Charts Control visualizes tabular data on a web page in several possible formats including vertical columns, horizontal bars, lines, and pies. Notable features include support for the DataSource Utility, customizable series and axes, a customizable mouse-over datatip, combination charts, and skinning.

http://developer.yahoo.com/yui/charts/

Open Flash Chart

Open Flash Chart works by requesting data from the server when a user loads a web page. The server will knows who the particular user is and it will generate a custom chart showing up to the minute data.

You will need to include the Open Flash Chart in your HTML, and you also need to provide the data file on the server. The data file is either a text file or a PHP, Perl, Python, Java (or another flavor of dynamic) page.

http://teethgrinder.co.uk/open-flash-chart-2/

XML/SWF Charts

XML/SWF Charts is a simple, yet powerful tool to create attractive charts and graphs from XML data. Create an XML source to describe a chart, and then pass it to this tool’s flash file to generate the chart. The XML source can be prepared manually, or generated dynamically using any scripting language (PHP, ASP, CFML, Perl, etc.).

http://www.maani.us/xml_charts/

FusionCharts

This version is the free and open-source Flash charting component from FusionCharts . It empowers you to create animated and interactive Flash charts for your web applications, desktop applications and presentations. It provides an impressive 22 popular charts like Column charts, Line charts, Pie charts, Bar charts, Area charts, Stacked charts, Candlestick and Funnel Charts, that will look the same across all browsers.

http://www.fusioncharts.com/free/

Flare – Data Visualization for the Web

Flare is an Action Script library for creating visualizations that run in the Adobe Flash Player. From basic charts and graphs to complex interactive graphics, the toolkit supports data management, visual encoding, animation, and interaction techniques. Even better, flare features a modular design that lets developers create customized visualization techniques with ease.

http://flare.prefuse.org/

Visifire – Silverlight and WPF Chart Controls

Visifire is a set of open source data visualization controls powered by Microsoft Silverlight. It is a multi-targeting control which can be used in both WPF and Silverlight applications, that can be used with ASP, ASP.Net, PHP, JSP, ColdFusion, Python, Ruby or just simple HTML.

http://www.visifire.com/

Axiis - Data Visualization Framework

Axiis is an open source data visualization framework that has been built upon the Degrafa graphics framework and Adobe Flex 3. Axiis provides pre-built visualization components as well as abstract layout patterns and rendering classes that allow you to create your own unique visualizations.

http://www.axiis.org/

ChartGo - Create Charts Online Fast, Easy and Free

ChartGo is an online generator that allows users to create charts online quickly. You can create bar charts, line charts or pie charts and you simply paste your data in the chart data area and hit the create chart button.

http://www.chartgo.com/

iCharts – Create, Share and Embed Interactive Charts

iCharts allows everyone to upload Excel sheets or manually add data from which they can easily create, share and embed interactive charts within minutes. iCharts can be published on the iCharts Portal at iCharts and they can be embedded anywhere on the Internet in blogs, forums or corporate websites.

http://www.icharts.net/

Chartle.net – Interactive Charts Online

Chartle is a very easy to use and completely free online chart generator that allows you to embed and share your plots, maps, charts, diagrams and business reports online. Chartlet is non-binding towards its users, there is no forced registration and all generated charts are your own. The only thing they ask is that you link back to them.

http://www.chartle.net/

Google Chart API

The Google Chart API returns a PNG-format image in response to a URL. Several types of images can be generated, including line, bar, and pie charts. For each image type, you can specify attributes such as size, colors, and labels.

http://code.google.com/apis/chart/

Chartpart.com – Chart Generator

This generator uses the Google Charts API to produce crisp and clear graphs that can be inserted into web based documents via a hyperlink or saved as a flat image file.

http://www.chartpart.com