Now: 27 JAVASCRIPT VISUALIZATION LIBRARIES (update 30-07-2012)

by admin admin Date: 30-07-2013 javascript libraries free visualizations data graphics

Do you need to reformat data for use in another application? Use it for an interactive Web graphic?

With JavaScript visualization libraries, it is possible to turn data sets into great web based visual representations that customers and management will love.

To help you get started visualizing your data, we have collected 25 of the best JavaScript visualization solutions for your web projects.

1. sigmajs – MORE INFO

Sigmajs is an open-source lightweight JavaScript library to draw graphs, using the HTML canvas element. It has been especially designed to display interactively static graphs exported from a graph visualization software and dynamically graphs that are generated on the fly.

D3.js is a JavaScript library for manipulating documents based on data. D3 helps you bring data to life using HTML, SVG and CSS. D3’s emphasis on web standards gives you the full capabilities of modern browsers without tying yourself to a proprietary framework, combining powerful visualization components and a data-driven approach to DOM manipulation.

Heatmap.js is an open source JavaScript library that can be used for generating realtime heatmaps. It uses the power and flexibility of the HTML5 canvas element to draw heatmaps based on your data.

5. ico – MORE INFO

Ico (GitHub: alexyoung / ico, License: MIT) is a JavaScript graph library. Graphs are created by instantiated classes.

Envision.js is a library for creating fast, dynamic and interactive HTML5 visualizations.

7. JavaScript Infovis Toolkit – MORE INFO

The JavaScript InfoVis Toolkit provides tools for creating Interactive Data Visualizations for the Web.

8. bonsaiJS – MORE INFO

A lightweight graphics library with an intuitive graphics API and an SVG renderer.

9. jQuery Sparklines – MORE INFO

ThisjQuery plugin generates small inline charts directly in the browser using data supplied either inline in the HTML, or via JavaScript. 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, 9 & 10 as well as iOS and Android.

10. Bluff – MORE INFO

Bluff is a JavaScript port of the Gruff graphing library for Ruby. It is designed to support all the features of Gruff with minimal dependencies; the only third-party scripts you need to run it are a copy of JS.Class (2.6kB gzipped) and a copy of Google’s ExCanvas to support canvas in Internet Explorer. Both these scripts are supplied with the Bluff download. Bluff itself is around 11kB gzipped.

jQuery.Gantt lets you draw Gantt charts using the famous jQuery ease of development.

12. flotr2 – MORE INFO

A modern graphing library for Canvas written in JavaScript.

13. moochart – MORE INFO

moochart is a plugin for MooTools 1.2 that draws bubble diagrams on the canvas tag. Future versions might include pie, bar & line graphs.

It was originally developed for an EU-Project on the Adobe AIR platform.

14. Rickshaw – MORE INFO

Rickshaw is a JavaScript toolkit for creating interactive time series graphs..

15. Simile Widget Timelines – MORE INFO

Timeline is a Web Widget for Visualizing Temporal Data. With this widget, you can make beautiful interactive timelines.

16. Milkchart – MORE INFO

MilkChart is released under the MIT license. It is simple and easy to understand and places almost no restrictions on what you can do with MilkChart.

This library will generate a graph similar to Microsoft Excel.

Processing.js is the sister project of the popular Processing visual programming language, designed for the web. Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins. You write code using the Processing language, include it in your web page, and Processing.js does the rest. It's not magic, but almost.

18. Vivagraph JS – MORE INFO

VivaGraphJS is a free graph drawing library for JavaScript. It is designed to be extensible and to support different rendering engines and layout algorithms. At the moment it supports rendering graphs using WebGL, SVG or CSS formats.

19. Raphaël JavaScript Library – MORE INFO

Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web. If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library.

Raphaël ['ræfeɪəl] uses the SVG W3C Recommendation and VML as a base for creating graphics. This means every graphical object you create is also a DOM object, so you can attach JavaScript event handlers or modify them later. Raphaël’s goal is to provide an adapter that will make drawing vector art compatible cross-browser and easy.

Raphaël currently supports Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.

20. Harry Plotter – MORE INFO

Harry is a lightweight standalone javascript library to plot data as charts, pies, lines or curves. requi8res browser supportimg canvass like Chrome,Firefox,Opera,Safari and IE9.

21. Protovis – MORE INFO

Protovis composes custom views of data with simple marks such as bars and dots. Unlike low-level graphics libraries that quickly become tedious for visualization, Protovis defines marks through dynamic properties that encode data, allowing inhritance, scales and layouts to simplify construction.

Protovis is free and open-source, provided under the BSD License. It uses JavaScript and SVG for web-native visualizations; no plugin required (though you will need a modern web browser)! Although programming experience is helpful, Protovis is mostly declarative and designed to be learned by example.

UPDATE : Protovis is no longer under active development.

The final release of Protovis was v3.3.1 (4.7 MB). The Protovis team is now developing a new visualization library, D3.js, with improved support for animation and interaction. D3 builds on many of the concepts in Protovis; for more details, please read the introduction and browse the examples.

22. JSXGraph – MORE INFO

JSXGraph is a cross-browser library for interactive geometry, function plotting, charting, and data visualization in a web browser. It is implemented completely in JavaScript, does not rely on any other library, and uses SVG, VML, or canvas. JSXGraph is easy to embed and has a small footprint: less than 100 KByte if embedded in a web page. No plug-ins are required! Special care has been taken to optimize the performance.

Toxiclibs.js is an open source computational design library ported to JavaScript. It works with great Canvas, with SVG or any ordinary DOM element.

24. Keylines – MORE INFO

KeyLines is a JavaScript toolkit for visualizing networks.

It works in all major browsers, and on all platforms, including the iPad. It uses HTML5 but also works on old versions of Internet Explorer.

KeyLines is ideal for organizations who want to migrate from legacy Java, Flex or Silverlight apps to the new world of HTML5.

jQuery.qrcode enables you to dynamically add QR codes to your website. Choose between rendering the code in a canvas or with divs. The latter will be fine even for older browser. The QR code will always be in the least possible type/resolution.

26. Chartjs – MORE INFO

Everything you need to know to create great looking charts using Chart.js.Easy, object oriented client side graphs for designers and developers

First of all, ChartJS is not Chartjs! Whether you are creating traditional websites, sites that target mobile devices, or native apps built with HTML5 JavaScript and compiled with Apache Cordova (PhoneGap), ChartJS provides high-performance and elegant data visualization options for all your business intelligence needs.