Creating an accessible data chart or graph in HTML is very tricky to achieve, especially with some elements, such as images, that allow only the most basic features that give textual information to non-visual users. What are the solutions?
PHP, Flash, Javscript (jQuery, MooTools, Prototype) and CSS can all be utilized successfully to implement interactive visualizations, and there are many techniques and solutions from each that will allow you to display them on web pages and apps.
Below we have compiled 25 solutions for displaying charts and graphs using various languages, if you prefer you may like to view our earlier article on CSS graph solutions: 16 Usable CSS Graph and Bar Chart Tutorials and Techniques.
The jQuery Visualize Plugin 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.
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.
The plugin 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.
MilkChart is a simple to use, yet robust library for transforming table data into a chart. This library uses the HTML5 <canvas> tag and is only supported on browsers other than IE until ExCanvas gets proper text support.
With mooCSSChart you can easily create animated bar charts.
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.
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.
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.
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.
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.
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 flavour of dynamic) page.
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, 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.).
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, Line, Pie, Bar, Area, Stacked, Candlestick and Funnel Chart, that will look the same across all browsers.
Flare is an ActionScript 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.
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.
Axiis is an open source data visualization framework that has been built upon the Degrafa graphics framework and Adobe Flex 3. Axiis provides both pre-built visualization components as well as abstract layout patterns and rendering classes that allow you to create your own unique visualizations.
ChartGo is an online generator that allow 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.
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.
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.
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.
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.