New Post has been published on Html Use
New Post has been published on http://www.htmluse.com/vis-js-a-dynamic-browser-based-visualization-library/
Vis.js - A dynamic, browser based visualization library
Download Demo
Vis.js is a dynamic, browser based visualization library. The library is designed to be easy to use, handle large amounts of dynamic data, and enable manipulation of the data. The library consists of the following components:
DataSet and DataView. A flexible key/value based data set. Add, update, and remove items. Subscribe on changes in the data set. A DataSet can filter and order items, and convert fields of items.
DataView. A filtered and/or formatted view on a DataSet.
Graph2d. Plot data on a timeline with lines or barcharts.
Graph3d. Display data in a three dimensional graph.
Network. Display a network (force directed graph) with nodes and edges.
Timeline. Display different types of data on a timeline.
1. INCLUDE CSS AND JS FILES
<link href="http://visjs.org/dist/vis.css" rel="stylesheet" type="text/css" /> <script src="http://visjs.org/dist/vis.js"></script>
2. HTML
<div id="mytimeline"></div>
3. JAVASCRIPT
// DOM element where the Timeline will be attached var container = document.getElementById('mytimeline'); // Create a DataSet with data (enables two way data binding) var data = new vis.DataSet([ id: 1, content: 'item 1', start: '2013-04-20', id: 2, content: 'item 2', start: '2013-04-14', id: 3, content: 'item 3', start: '2013-04-18', id: 4, content: 'item 4', start: '2013-04-16', end: '2013-04-19', id: 5, content: 'item 5', start: '2013-04-25', id: 6, content: 'item 6', start: '2013-04-27' ]); // Configuration for the Timeline var options = ; // Create a Timeline var timeline = new vis.Timeline(container, data, options);
