HTMLcopy
1
<div id="container"></div>
CSScopy
6
1
html, body, #container {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
var stage = anychart.graphics.create("container");
3
4
var data = getData();
5
6
var treeData = anychart.data.tree(data, "asTable");
7
8
var timeLine = anychart.standalones.resourceTimeline();
9
10
timeLine.data(treeData);
11
12
// Set default row height.
13
timeLine.defaultRowHeight(30);
14
15
timeLine.container(stage);
16
timeLine.draw();
17
});
18
function getData() {
19
return [
20
{
21
"id": "1",
22
"name": "Alex Exler",
23
"periods": [
24
{"id": "1_1", "start": 1171468800000, "end": 1171987200000},
25
{"id": "1_2", "start": 1174921200000, "end": 1175612400000},
26
{"id": "1_3", "start": 1177599600000, "end": 1178550000000},
27
{"id": "1_4", "start": 1182092400000, "end": 1182697200000},
28
{"id": "1_5", "start": 1183647600000, "end": 1183906800000},
29
{"id": "1_6", "start": 1186412400000, "end": 1187708400000},
30
{"id": "1_7", "start": 1190646000000, "end": 1191337200000},
31
{"id": "1_8", "start": 1193760000000, "end": 1194192000000},
32
{"id": "1_9", "start": 1196870400000, "end": 1197302400000},
33
{"id": "1_10", "start": 1201017600000, "end": 1201449600000},
34
{"id": "1_11", "start": 1207148400000, "end": 1207666800000},
35
{"id": "1_12", "start": 1209913200000, "end": 1210518000000},
36
{"id": "1_13", "start": 1213542000000, "end": 1213801200000},
37
{"id": "1_14", "start": 1214838000000, "end": 1215356400000},
38
{"id": "1_15", "start": 1216566000000, "end": 1216911600000},
39
{"id": "1_16", "start": 1218380400000, "end": 1219330800000},
40
{"id": "1_17", "start": 1222182000000, "end": 1222614000000},
41
{"id": "1_18", "start": 1225728000000, "end": 1226851200000},
42
{"id": "1_19", "start": 1229356800000, "end": 1229961600000}
43
]
44
},
45
{
46
"id": "2",
47
"name": "Philip Kineyko",
48
"periods": [
49
{"id": "2_1", "start": 1173024000000, "end": 1173715200000},
50
{"id": "2_2", "start": 1173888000000, "end": 1174406400000},
51
{"id": "2_3", "start": 1176994800000, "end": 1177945200000},
52
{"id": "2_4", "start": 1180364400000, "end": 1180882800000},
53
{"id": "2_5", "start": 1182956400000, "end": 1183647600000}
54
]
55
},
56
{
57
"id": "3",
58
"name": "Luke Liakos",
59
"periods": [
60
{"id": "3_1", "start": 1169740800000, "end": 1170172800000},
61
{"id": "3_2", "start": 1171987200000, "end": 1172505600000},
62
{"id": "3_3", "start": 1175439600000, "end": 1176217200000},
63
{"id": "3_4", "start": 1176908400000, "end": 1178463600000},
64
{"id": "3_5", "start": 1180364400000, "end": 1180537200000},
65
{"id": "3_6", "start": 1184684400000, "end": 1185721200000},
66
{"id": "3_7", "start": 1187535600000, "end": 1188226800000},
67
{"id": "3_8", "start": 1189350000000, "end": 1190041200000},
68
{"id": "3_9", "start": 1190559600000, "end": 1191250800000},
69
{"id": "3_10", "start": 1193065200000, "end": 1193846400000},
70
{"id": "3_11", "start": 1197561600000, "end": 1197907200000},
71
{"id": "3_12", "start": 1199376000000, "end": 1200240000000},
72
{"id": "3_13", "start": 1202140800000, "end": 1202745600000},
73
{"id": "3_14", "start": 1207580400000, "end": 1208098800000},
74
{"id": "3_15", "start": 1211900400000, "end": 1212418800000},
75
{"id": "3_16", "start": 1215702000000, "end": 1215961200000},
76
{"id": "3_17", "start": 1218985200000, "end": 1219158000000}
77
]
78
}
79
];
80
}