HTMLcopy
1
<button onclick="collapseTask()">Collapse one task</button>
2
<button onclick="expandTask();">Expand one task</button>
3
<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
var chart;
2
3
function collapseTask() {
4
5
// Collapse task.
6
chart.collapseTask('2');
7
}
8
9
function expandTask() {
10
11
// Expand task.
12
chart.expandTask('2');
13
}
14
15
anychart.onDocumentReady(function () {
16
var data = getData();
17
chart = anychart.ganttProject();
18
chart.data(data, 'as-table');
19
chart.title('Collapse/Expand one task');
20
chart.splitterPosition(223);
21
chart.container('container');
22
chart.draw();
23
chart.fitAll();
24
});
25
26
function getData() {
27
return [
28
{id: 1, name: 'Phase 1 - Strategic Plan', progressValue: 0.14, actualStart: '2000-02-24T08:00', actualEnd: '2000-03-28T09:00'},
29
{id: 2, name: 'Self-Assessment', parent: 1, progressValue: 0.25, actualStart: '2000-02-24T08:00', actualEnd: '2000-03-02T08:00'},
30
{id: 3, name: 'Define business vision', parent: 2, progressValue: 0, actualStart: '2000-02-25T00:00', actualEnd: '2000-02-25T09:00', connectTo: 4, connectorType: 'finish-start'},
31
{id: 4, name: 'Identify available skills, information and support', parent: 2, progressValue: 0, actualStart: '2000-02-26T00:00', actualEnd: '2000-02-26T09:00', connectTo: 5, connectorType: 'finish-start'},
32
{id: 5, name: 'Decide whether to proceed', parent: 2, progressValue: 0, actualStart: '2000-02-29T00:00', actualEnd: '2000-02-29T09:00', connectTo: 7, connectorType: 'finish-start'},
33
{id: 6, name: 'Define the Opportunity', parent: 1, progressValue: 0.27, actualStart: '2000-02-29T08:00', actualEnd: '2000-03-14T08:00'},
34
{id: 7, name: 'Research the market and competition', parent: 6, progressValue: 0, actualStart: '2000-03-01T00:00', actualEnd: '2000-03-01T09:00', connectTo: 8, connectorType: 'finish-start'},
35
{id: 8, name: 'Interview owners of similar businesses', parent: 6, progressValue: 0.6, actualStart: '2000-03-01T08:00', actualEnd: '2000-03-08T08:00', connectTo: 9, connectorType: 'finish-start'},
36
{id: 9, name: 'Identify needed resources', parent: 6, progressValue: 0, actualStart: '2000-03-09T00:00', actualEnd: '2000-03-10T09:00', connectTo: 10, connectorType: 'finish-start'},
37
{id: 10, name: 'Identify operating cost elements', parent: 6, progressValue: 0, actualStart: '2000-03-11T00:00', actualEnd: '2000-03-14T09:00', connectTo: 12, connectorType: 'finish-start'},
38
{id: 11, name: 'Evaluate Business Approach', parent: 1, progressValue: 0, actualStart: '2000-03-15T00:00', actualEnd: '2000-03-18T09:00'},
39
{id: 12, name: 'Define new entity requirements', parent: 11, progressValue: 0, actualStart: '2000-03-15T00:00', actualEnd: '2000-03-15T09:00', connectTo: 17, connectorType: 'finish-start'},
40
{id: 13, name: 'Identify on-going business purchase opportunities', parent: 11, progressValue: 0, actualStart: '2000-03-16T00:00', actualEnd: '2000-03-16T09:00', connectTo: 14, connectorType: 'finish-start'},
41
{id: 14, name: 'Research franchise possibilities', parent: 11, progressValue: 0, actualStart: '2000-03-17T00:00', actualEnd: '2000-03-17T09:00', connectTo: 15, connectorType: 'finish-start'},
42
{id: 15, name: 'Summarize business approach', parent: 11, progressValue: 0, actualStart: '2000-03-18T00:00', actualEnd: '2000-03-18T09:00', connectTo: 21, connectorType: 'finish-start'},
43
{id: 16, name: 'Evaluate Potential Risks and Rewards', parent: 1, progressValue: 0, actualStart: '2000-03-16T00:00', actualEnd: '2000-03-25T09:00'},
44
{id: 17, name: 'Assess market size and stability', parent: 16, progressValue: 0, actualStart: '2000-03-16T00:00', actualEnd: '2000-03-17T09:00', connectTo: 18, connectorType: 'finish-start'},
45
{id: 18, name: 'Estimate the competition', parent: 16, progressValue: 0, actualStart: '2000-03-18T00:00', actualEnd: '2000-03-18T09:00', connectTo: 19, connectorType: 'finish-start'}
46
];
47
}