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