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 = [
3
{id: 'Eurasia', parent: null, timezone: {utc: 'Variable value'}},
4
{id: 'Asia', parent: 'Eurasia', timezone: {utc: 'Variable value'}},
5
{id: 'Eastern Asia', parent: 'Asia'},
6
{id: 'Mongolia', parent: 'Eastern Asia', value: 1564116, capital: 'Ulan-Bator', timezone: {utc: 'UTC+7'}},
7
{id: 'China', parent: 'Eastern Asia', value: 1564116, capital: 'Beijing', timezone: {utc: 'UTC+8'}},
8
{id: 'Southern Korea', parent: 'Eastern Asia', value: 1564116, capital: 'Seoul', timezone: {utc: 'UTC+9'}},
9
{id: 'Northern Korea', parent: 'Eastern Asia', value: 120540, capital: 'Pyongyang', timezone: {utc: 'UTC+9'}},
10
{id: 'Japan', parent: 'Eastern Asia', value: 1564116, capital: 'Tokio', timezone: {utc: 'UTC+8'}},
11
{id: 'Europe', parent: 'Eurasia', timezone: {utc: 'Variable value'}},
12
{id: 'Northern Europe', parent: 'Europe', timezone: {utc: 'Variable value'}},
13
{id: 'Finland', parent: 'Northern Europe', value: 338424, capital: 'Helsinki', timezone: {utc: 'UTC+2'}},
14
{id: 'Great Britain', parent: 'Northern Europe', value: 209331, capital: 'London', timezone: {utc: 'UTC+0'}},
15
{id: 'Ireland', parent: 'Northern Europe', value: 84421, capital: 'Dublin', timezone: {utc: 'UTC+0'}},
16
{id: 'Scandinavia', parent: 'Northern Europe', value: 928057, timezone: 'UTC+0'}];
17
18
var chart = anychart.treeMap();
19
20
var treeData = anychart.data.tree(data, 'as-table');
21
22
chart.data(treeData);
23
24
var item = treeData.search('id', 'Eastern Asia');
25
chart.drillTo(item);
26
27
var tooltip = chart.tooltip();
28
tooltip.format(function () {
29
30
// Get data.
31
return this.getData('timezone', 'utc');
32
});
33
34
chart.title().orientation('bottom');
35
chart.title().padding(10);
36
37
chart.labels().format('{%id}');
38
chart.title('Get treemap data using several parameters');
39
chart.container('container');
40
chart.draw();
41
});