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 stage = anychart.graphics.create("container");
3
4
var rawdata = [
5
{id: "1", name: "1"},
6
{id: "2", name: "2"},
7
{id: "3", name: "1-3", parent: "1"},
8
{id: "4", name: "2-4", parent: "2"},
9
{id: "5", name: "5"},
10
{id: "6", name: "5-6", parent: "5"},
11
{id: "7", name: "6-7", parent: "6"},
12
{id: "8", name: "4-8", parent: "4"},
13
{id: "9", name: "7-9", parent: "7"}
14
];
15
// Sets filling method for tree.
16
var tree = anychart.data.tree(rawdata, anychart.enums.TreeFillingMethod.AS_TABLE);
17
18
var dataGrid = anychart.standalones.dataGrid();
19
dataGrid.data(tree);
20
dataGrid.headerHeight(25);
21
dataGrid.container(stage);
22
dataGrid.draw();
23
});