HTMLcopy
1
<div id="container"></div>
CSScopy
8
1
html,
2
body,
3
#container {
4
width: 100%;
5
height: 100%;
6
margin: 0;
7
padding: 0;
8
}
JavaScriptcopy
19
1
anychart.onDocumentReady(function () {
2
anychart.data.loadJsonFile(
3
'https://cdn.anychart.com/samples/circle-packing/ancient-greek-philosophers/data.json',
4
function(data) {
5
var treeData = anychart.data.tree(data, 'as-table');
6
var chart = anychart.circlePacking(treeData);
7
var palette = anychart.theme()[0] ? anychart.theme()[0].palette.items : anychart.palettes.defaultPalette;
8
chart.fill(function() {
9
return palette[this.depth];
10
});
11
chart.hovered().fill(function () {
12
return anychart.color.darken(palette[this.depth], this.depth / 10 + 0.1);
13
});
14
chart.labels().anchor('center-top').offsetY('5%');
15
chart.container('container');
16
chart.draw();
17
}
18
);
19
});