InfoVis is an open source JavaScript data visualization toolkit offering multiple ways to present data using the canvas tag.

It is feeded with data in JSON format & some of the ready to use visualizations are:

• treemaps
• radial layouts
• bar charths, pie charts & more…

Besides a static presentations, InfoVis supports interactive animations which can be fired by any event (like mouseovers, clicks).

It has various methods to add/remove/update nodes & manipulate every aspect of the outputs.

The toolkit doesn’t depend on a JavaScript framework, can be used with any of them & easily updated for adding new features to it.

jqPlot is a jQuery plotting plugin which can generate very good looking line and bar charts.

The plugin offers various features like:

• different chart style options
• ability to rotate axis text & customize date axes
• tooltips, data point highlighting & more..

jqPlot itself has a plugin support too and it be extended with new chart types & options.

Almost every aspect of the charts created can be controlled like the background of the grid, show/hide ticks, font sizes/types & much more.

The plugin is very well-documented & provides very nice examples.

Axiis is an open source data visualization framework & based on Degrafa, Flex & ActionScript 3.0.

It is a resource for both beginner & expert developers to create elegant charts.

Axiis comes with both ready-to-use visualization components & abstract layout patterns + rendering classes that makes it possible to create custom visualizations.

To view some beautiful examples of this framework, click here.

Descry is a project to demonstrate the power of data and information visualization as a communication tool.

Currently, there are 4 examples provided, all built with Silverlight & come with the source codes.

There are also 2 very nice articles shared on visualization:

• Visualization Trends For The Noosphere
• 5 Tips For Building Effective Infographics

For a demo, click here.

P.S. Descry is not a toolkit. It contains classes and fragments of code or design elements that can be reused.

Kap Lab is presenting 5 impressive & free visualization components for Flex.

All components are AS3 based & some of them offer multiple layout options which makes them very flexible in means of presentation.

The components are:

• Diagrammer (for diagram creation, mind mapping…)
• Visualizer (for displaying hierarchies like organizational schemas..)
• Radar Chart (for data analysis, comparing data items…)
• Treemap (for inventory management, social news mapping…)
• Ring Chart (for displaying statistics)

Examples are provided for each component with the sources & there is a support forum where users share their experiences.

P.S. Download requires a free membership.

Protovis is a JavaScript library for visualizing data using the canvas element.

Custom views of data can be composed with simple graphical primitives like bars and dots. These primitives are called marks, and each mark encodes data visually through dynamic properties such as color and position.

Although Protovis looks complicated, it is very easy to understand (specially for JavaScript users) & has a straight forward logic which offers a flexible way to create any type of visualizations.

To see more, you can check the API documentation (very well-documented) & examples built with it.

Flash has popular free libraries / classes to extend the core functionality like Papervision3D, AlivePDF, Flare or Tweener.

There are also less-known ones which are still very powerful & can make the development process of a Flash application easier / faster.

Here is 10 of them that you will find handy (you know more? please share them in the comments).

Playr

A beautiful AS3 music player class.

It has support for playlist management or playing a single file, loops & more.

flXHR

A Flash solution that mimics Ajax (& provides more) by a XMLHttpRequest compatible interface.

It uses a Flash file: flxhr.swf which works like a proxy between requests & supports cross-domain Ajax.

KitchenSync

This ActionScript 3.0 library is focused on sequencing animations and other time-based actions.

It includes a number of features and shortcuts, such as the clone() method, that save effort for developers.

Read the rest of this entry »

Flash, Silverlight & JavaScript are already offering quality solutions for creating graphs. On the other hand, it is impressive to see what an be done in visualising data with CSS.

After the pure CSS data chart, Css Globe is presenting a very creative tutorial (with source codes) on creating a pure CSS line graph.

The solution creates a vertical/horizontal grid with dd & dl elements in the background. And, a smartly prepared image is used with CSS sprites technique to display the lines.

Although it looks complicated, the technique is simple yet clever & inspiring.

JS Charts is a free JavaScript library for creating good looking charts.

Data to be visualized can be gathered from a JavaScript array or a XML file.

The library supports 3 types of charts:

• Bar charts
• Pie charts
• Line graphs

Charts can be created & customized with ease (the type of the chart, colors to be used, titles of every unit).

This free JavaScript charts library is well documented, provides examples and an online editor.

P.S. Although the library is free to use, it requires that you register (again free).

JSXGraph is a cross-browser library for interactive geometry, function plotting, graphs, and data visualization in a web browser.

It is implemented totally in JavaScript and uses SVG and VML.

A graphic can be created via:

• 100% JavaScript
• a GEONExT file (or string)
• an Inteorgeo file

It supports many, basic to advanced, mathematical functions that make creating complex visualizations easier.

P.S. JSXGraph requires Prototype JS library to run.