From cd381f71d5d1d0cf28046f90c3a6b7de966b6d34 Mon Sep 17 00:00:00 2001 From: jos Date: Tue, 17 Jun 2014 15:46:51 +0200 Subject: [PATCH] Added an example demonstrating data serialization/deserialization --- examples/timeline/16_navigation_menu.html | 2 +- examples/timeline/17_data_serialization.html | 120 +++++++++++++++++++ examples/timeline/index.html | 1 + examples/timeline/requirejs/scripts/main.js | 4 +- 4 files changed, 124 insertions(+), 3 deletions(-) create mode 100644 examples/timeline/17_data_serialization.html diff --git a/examples/timeline/16_navigation_menu.html b/examples/timeline/16_navigation_menu.html index a51d435d..7c5153be 100755 --- a/examples/timeline/16_navigation_menu.html +++ b/examples/timeline/16_navigation_menu.html @@ -38,7 +38,7 @@ + + + + +

Serialization and deserialization

+ +

This example shows how to serialize and deserialize JSON data, and load this in the Timeline via a DataSet. Serialization and deserialization is needed when loading or saving data from a server.

+ + + +
+ + +
+ +
+ + + + \ No newline at end of file diff --git a/examples/timeline/index.html b/examples/timeline/index.html index d94e82a6..88ba04b7 100644 --- a/examples/timeline/index.html +++ b/examples/timeline/index.html @@ -28,6 +28,7 @@

14_a_lot_of_grouped_data.html

15_item_class_names.html

16_navigation_menu.html

+

17_data_serialization.html

requirejs_example.html

diff --git a/examples/timeline/requirejs/scripts/main.js b/examples/timeline/requirejs/scripts/main.js index ff6d5108..6549d024 100644 --- a/examples/timeline/requirejs/scripts/main.js +++ b/examples/timeline/requirejs/scripts/main.js @@ -6,14 +6,14 @@ require.config({ require(['vis'], function (vis) { var container = document.getElementById('visualization'); - var data = [ + 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'} - ]; + ]); var options = {}; var timeline = new vis.Timeline(container, data, options); });