vis.js timeline

vis.js timeline

http://visjs.org/index.html1

 

 Groups definieren:

Zie: http://visjs.org/docs/timeline/#groups2

De volgende velden kunnen worden gedefinieerd: id, content, className,  style, subgroupOrder, title

var groups = new vis.DataSet([
{id: 0, content: ‘c. Breckelenkamp’, value: 1},
{id: 1, content: ‘b. Kunstgeschiedenis’, value: 3, style: ‘color: red; background-color: pink;’},
{id: 2, content: ‘a. Tijdlijnen’, value: 2, className: ‘bibber’}
]);

 

Items definieren:

Zie: http://visjs.org/docs/timeline/#items2

Zie de link voor alle velden die kunnen worden gedefinieerd
// create a dataset with items
// note that months are zero-based in the JavaScript Date object, so month 3 is April
var items = new vis.DataSet([
{id: 0, group: 0, content: ‘item 0 <br /> Dit is een item meet alleen een startdatum’, start: new Date(2014, 3, 17)},
{id: 1, group: 0, content: ‘item zonber eind’, start: new Date(2014, 3, 19)},
{id: 2, group: 1, className: ‘achter_herald’, content: ”, type: ‘background’, start: new Date(2014, 3, 16), end: new Date(2014, 3, 24)},
{id: 3, group: 1, content: ‘item 3’, start: new Date(2014, 3, 23), end: new Date(2014, 3, 24)},
{id: 4, group: 1, content: ‘item 4’, start: new Date(2014, 3, 22), end: new Date(2014, 3, 26)},
{id: 5, group: 1, content: ‘item 1’, start: new Date(2014,1,1)},
{id: 6, group: 1, content: ‘item 2’, start: new Date(2014,2,1)},
{id: 7, group: 1, content: ‘item 3’, start: new Date(2014,1,12)},
{id: 8, group: 2, content: ‘Hier begon het allemaal’, start: new Date(2014,1,8), end: new Date(2014,01,25)},
{id: 9, group: 1, content: ‘item 5’, start: new Date(2014,1,17)},
{id: 10, group: 2, content: ‘item 5’, start: new Date(2014, 3, 24), end: new Date(2014, 3, 27)},
{id: 11, group: 2, content: ‘Dit is eigenlijk het zelfde verhaal..’, start: new Date(2014,1,8), end: new Date(2014,01,25)}

]);

Comments are closed.