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 data = [
5
{id: 1, name: 'Phase 1 - Strategic Plan'},
6
{id: 2, name: 'Self-Assessment'},
7
{id: 3, name: '14%', parent: 1},
8
{id: 4, name: '25%', parent: 2},
9
{id: 5, name: 'Define business vision'},
10
{id: 6, name: '0%', parent: 5},
11
{id: 7, name: 'Interview owners of similar businesses'}
12
];
13
14
var treeData = anychart.data.tree(data, 'as-table');
15
16
var dataGrid = anychart.standalones.dataGrid();
17
dataGrid.data(treeData);
18
dataGrid.headerHeight(25);
19
20
// Set background fill.
21
dataGrid.backgroundFill(['#FFEFD5', '#CD853F'], 45, true, 0.5);
22
23
dataGrid.container(stage);
24
dataGrid.draw();
25
});