HTMLcopy
1
<button onclick="removeItem()">Remove Last Child</button>
2
<div id="container"></div>
CSScopy
15
1
html, body {
2
width: 100%;
3
height: 100%;
4
margin: 0;
5
padding: 0;
6
}
7
button {
8
margin: 10px 0 0 10px;
9
}
10
#container {
11
position: absolute;
12
width: 100%;
13
top: 35px;
14
bottom: 0;
15
}
JavaScriptcopy
x
1
anychart.onDocumentReady(function () {
2
3
// create data
4
var data = [
5
{name: "Root", children: [
6
{name: "Child 1", value: 80636124},
7
{name: "Child 2", value: 65511098},
8
{name: "Child 3", value: 64938716},
9
{name: "Child 4", value: 59797978},
10
{name: "Child 5", value: 46070146},
11
{name: "Child 6", value: 38563573},
12
{name: "Child 7", value: 19237513},
13
{name: "Child 8", value: 17032845},
14
{name: "Child 9", value: 11443830},
15
{name: "Child 10", value: 10892931}
16
]}
17
];
18
19
// create a data tree
20
treeData = anychart.data.tree(data, "as-tree");
21
22
// create a chart and set the data
23
var chart = anychart.treeMap(treeData);
24
25
// set the chart title
26
chart.title("Tree Data Model: Removing");
27
28
// set the container id
29
chart.container("container");
30
31
// initiate drawing the chart
32
chart.draw();
33
});
34
35
// remove the last child
36
function removeItem() {
37
var lastChild = treeData.getChildAt(0).getChildren().length - 1;
38
treeData.getChildAt(0).removeChildAt(lastChild);
39
}