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
chart.data(data, 'as-table');
6
7
var timeLine = chart.getTimeline();
8
9
chart.title('Set timeline scale');
10
chart.container('container');
11
chart.draw();
12
13
// Set timeline scale.
14
timeLine.scale({maximum: Date.UTC(2000, 2, 2)});
15
16
chart.fitAll();
17
});
18
19
function getData() {
20
return [
21
{
22
id: 1,
23
name: 'Phase 1 - Strategic Plan',
24
progressValue: 0.14,
25
actualStart: '2000-02-24',
26
actualEnd: '2000-02-27'
27
},
28
{
29
id: 2,
30
name: 'Self-Assessment',
31
parent: 1,
32
progressValue: 0.25,
33
actualStart: '2000-02-24',
34
actualEnd: '2000-02-29'
35
},
36
{
37
id: 3,
38
name: 'Define business vision',
39
parent: 2,
40
progressValue: 0,
41
actualStart: '2000-02-24T24:00',
42
actualEnd: '2000-02-25T09:00',
43
connectTo: 4,
44
connectorType: 'finish-start'
45
},
46
{
47
id: 4,
48
name: 'Identify available skills, information and support',
49
parent: 2,
50
progressValue: 0,
51
actualStart: '2000-02-26T00:00',
52
actualEnd: '2000-02-26T09:00',
53
connectTo: 5,
54
connectorType: 'finish-start'
55
},
56
{
57
id: 5,
58
name: 'Decide whether to proceed',
59
parent: 2,
60
progressValue: 0,
61
actualStart: '2000-02-27',
62
actualEnd: '2000-02-28T08:00',
63
connectTo: 6,
64
connectorType: 'finish-start'
65
},
66
{
67
id: 6,
68
name: 'Define the Opportunity',
69
parent: 1,
70
progressValue: 0.27,
71
actualStart: '2000-02-28T08:00',
72
actualEnd: '2000-02-29'
73
},
74
{
75
id: 7,
76
name: 'Research the market and competition',
77
parent: 6,
78
progressValue: 0,
79
actualStart: '2000-02-26T08:00',
80
actualEnd: '2000-02-27'
81
}
82
];
83
}