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 data = getData();
3
4
var chart = anychart.ganttProject();
5
6
chart.data(data, "asTable");
7
8
chart.bounds(0, 0, "100%", "20%");
9
chart.title("Set row index to vertical scroll");
10
chart.container("container");
11
chart.draw();
12
13
// Set row index.
14
chart.scrollToRow(2);
15
16
chart.fitAll();
17
});
18
function getData() {
19
return [
20
{
21
"id": "1",
22
"name": "Phase 1 - Strategic Plan",
23
"progressValue": "14%",
24
"actualStart": 951350400000,
25
"actualEnd": 951609600000
26
},
27
{
28
"id": "2",
29
"name": "Self-Assessment",
30
parent: "1",
31
"progressValue": "25%",
32
"actualStart": 951350400000,
33
"actualEnd": 951782400000
34
},
35
{
36
"id": "3",
37
"name": "Define business vision",
38
parent: "2",
39
"progressValue": "0%",
40
"actualStart": 951408000000,
41
"actualEnd": 951440400000,
42
"connectTo": "4",
43
"connectorType": "FinishStart"
44
},
45
{
46
"id": "4",
47
"name": "Identify available skills, information and support",
48
parent: "2",
49
"progressValue": "0%",
50
"actualStart": 951494400000,
51
"actualEnd": 951526800000,
52
"connectTo": "5",
53
"connectorType": "FinishStart"
54
},
55
{
56
"id": "5",
57
"name": "Decide whether to proceed",
58
parent: "2",
59
"progressValue": "0%",
60
"actualStart": 951609600000,
61
"actualEnd": 951696000000,
62
"connectTo": "6",
63
"connectorType": "FinishStart"
64
},
65
{
66
"id": "6",
67
"name": "Define the Opportunity",
68
parent: "1",
69
"progressValue": "27%",
70
"actualStart": 951696000000,
71
"actualEnd": 951782400000
72
},
73
{
74
"id": "7",
75
"name": "Research the market and competition",
76
parent: "6",
77
"progressValue": "0%",
78
"actualStart": 951523200000,
79
"actualEnd": 951609600000,
80
"connectTo": "8",
81
"connectorType": "FinishStart"
82
}
83
];
84
}