10 Awesome Data Visualization Tools for the Web

10 Awesome Data Visualization Tools for the Web

Share on Facebook+1Share on LinkedInShare on TumblrShare on Twitter

Data Visualization is an upcoming and exciting field that represents data in aesthetically pleasing and readily comprehensible form. Instead of using boring excel sheets, data can be presented in a more creative format with the help of Data Visualization tools.

The term Data Visualization is closely related to information graphics, information visualization, scientific visualization and statistical graphics. It presents complex sets of data in an interactive and intuitive way. There are many tools available online that can help you to create your own data visualizations easily and speedily.

Today we take a look at some creative and interesting Data Visualization tools that web designers and developers might find useful. So bid farewell to your uninteresting excel data sheets and say hello to Data Visualization tools that make your data into stunning, interactive pieces of art.

Arbor.js

Arbor.js

Arbor.js is a graph visualization library built with web workers and jQuery. Rather than trying to be an all-encompassing framework, arbor provides an efficient, force-directed layout algorithm plus abstractions for graph organization and screen refresh handling. You can use it with canvas, SVG, or even positioned HTML elements depending on your project requirements. The code written in this form focuses on making your project unique instead of working on the physics and math that make the layout possible.

D3.js

D3.js

This is a JavaScript library that helps in manipulating documents based on data. It uses HTML, SVG and CSS to create visualizations. With D3.js, the complete capabilities of new-age browsers can be used without being constrained to a framework. It combines powerful visualization components and a data-driven approach to Direct Object Model (DOM) manipulation.

D3.js is not a monolithic framework that seeks to provide every conceivable feature. Instead, D3.js solves the crux of the problem: efficient manipulation of documents based on data. This avoids proprietary representation and affords extraordinary flexibility, exposing the full capabilities of web standards such as CSS3, HTML5 and SVG.

Envision.js

Envision.js

With Envision.js, you can create dynamic interactive HTML5 data visualizations. This tool is a rewrite of HumbleFinance, a library for HTML5 canvas finance visualization.

It comes with an arsenal of features like compatibility with modern browsers, touch/ mobile support, HTML5 Charts, API for Custom Visualizations, framework Agnostic, adapted to Flotr2,etc.

Google Chart Tools

Google Chart Tools

 

This tool, from the internet giant Google, can help a user create Pie Charts, Tables, Scatter Charts, etc. The maps are customizable, compatible on a variety of browsers and portable on iOS and Android platform. Users will appreciate the simplicity of use and the familiarity of the Google interface.

Kartograph

Kartograph

This is an easy-to-use, lightweight framework to make stunning interactive maps without Google Maps or any similar service. This tool was created keeping journalists and designers in mind. Kartograph is still in the stage of development, but once done, it’ll definitely have more features.

The core concept of Kartograph is to separate the mapping process in the map generation and map rendering part.  You can chose among hundreds of ready-to-use maps or simply generate your own using kartograph.py.

Leaflet

Leaflet.js

Leaflet is an open source JavaScript library for making tie-based, interactive, mobile-friendly maps. Even though it is light in weight, it still has tons of features and provides a good user experience. It is built from the ground up to work efficiently and smoothly on both desktop and mobile platforms like iOS and Android, taking advantage of HTML5 and CSS3 on modern browsers. The focus is on usability, performance, small size, A-grade browser support, convention over configuration and an easy-to-use API.

Paper.js

Paper.js

Paper.js is an open source framework for scripting vector graphics. It runs on top of the HTML5 canvas. It offers a Scene Graph/ Document Object Model for creating the vector graphics and a well designed programming interface.

Paper.js is based on and largely compatible with Scriptographer, a scripting environment for Adobe Illustrator. Paper.js is aimed at modern browsers with support for the Canvas object.

Polymaps

Polymaps

Apart from providing data in the usual map form, Polymaps also displays multi-zoom datasets over maps, and presents tiled vector data in various formats. As it uses SVG (Scalable Vector Graphics) to display information, developers can define the design of the data using CSS.

Polymaps is the best tool to show information from a country level down to states, cities, neighborhoods, and individual streets because it can load data at a full range of scales. The goal of Polymaps is to better support rich, large-scale data overlays on interactive maps by extending the tile metaphor to vector graphics.

Processing.js

Processing.js

Processing.js is developed by the same team that made Processing, the  popular programming language. You can make data visualizations, digital art, interactive animations, educational graphs, video games, etc. using Processing.js without using plug-ins.

Processing.js allows Processing code to be run by any HTML5 compatible browser and brings the best of visual programming to the web, both for web developers.

Sigma.js

Sigma.js

Sigma.js is JavaScript library that uses the HTML canvas element to produce graphs. This open source lightweight tool requires minimal coding and contains a simple and accessible public API.

Sigma.js is hosted on Github and is mostly inspired by Gephi.

Related posts:

  1. BBC Interactive Data Visualization on Alien Civilizations
  2. The xx Promotes Their New Album Coexist with Interactive Data Visualization
  3. The Internet Map: A Data Visualization of the Internet
  4. Google Chrome Web Lab: 5 Interactive Experiments
  5. Data Visualization Meets Interactive Video Installation
  • http://visual-js.blogspot.com/2012/05/10-awesome-data-visualization-tools-for.html Edi

    Thanks!

    I featured it om my blog.

  • http://digitalanalog.in d-funk

    Interesting article and some good selection of data visualization tools for the web.

    Another javascript data visualization library worth considering is Raphael - http://raphaeljs.com/ that simplifies working with vectors on the web.

  • Pingback: Shivendra Soni (ishivendra) | Pearltrees