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