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
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
var treeData = anychart.data.tree(data, "as-tree");
21
22
// create a chart and set the data
23
var chart = anychart.treeMap(treeData);
24
25
// get the name of the last child
26
var lastChild = treeData.getChildAt(0).getChildren().length - 1;
27
var lastChildName = treeData.getChildAt(0).getChildAt(lastChild).get("name");
28
29
// set the chart title
30
chart.title().useHtml(true);
31
chart.title("Tree Data Model: Reading<br><br>" +
32
"last child = <span style = 'color:#990000'>" +
33
lastChildName + "</span>");
34
35
// set the container id
36
chart.container("container");
37
38
// initiate drawing the chart
39
chart.draw();
40
});