html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

    var stage = anychart.graphics.create('container');

​

    var data = [

        {id: 1, name: 'Phase 1 - Strategic Plan'},

        {id: 2, name: 'Self-Assessment'},

        {id: 3, name: '14%', parent: 1},

        {id: 4, name: '25%', parent: 2},

        {id: 5, name: 'Define business vision'},

        {id: 6, name: '0%', parent: 5},

        {id: 7, name: 'Interview owners of similar businesses'}

    ];

​

    var treeData = anychart.data.tree(data, 'as-table');

​

    var dataGrid = anychart.standalones.dataGrid();

    dataGrid.data(treeData);

    dataGrid.headerHeight(25);

​

    // Set background fill.

    dataGrid.backgroundFill({color: '#2BC0E4', opacity: 0.3});

​

    dataGrid.container(stage);

    dataGrid.draw();

});