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