html, body {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

button {

    margin: 10px 0 0 10px;

}

#container {

    position: absolute;

    width: 100%;

    top: 35px;

    bottom: 0;

}

anychart.onDocumentReady(function () {

​

    // create data

    var data = [

      {name: "Company A", children: [

        {name: "Technical", children: [

          {name: "Team Leaders"},

          {name: "Architects"},

          {name: "Developers"},

          {name: "Testers"}

        ]},

        {name: "Sales", children: [

          {name: "Analysts"},

          {name: "Executives"}

        ]},

        {name: "HR"},

        {name: "Management"}

      ]}

    ];

​

    // create a data tree

    treeData = anychart.data.tree(data, "as-tree");

​

    // create a chart and set the data

    chart = anychart.sunburst(treeData);

​

    /* listen to the chartDraw event

    and add the drilldown path to the chart title */

    chart.listen("chartDraw",function() {

      // get the drilldown path and convert it to a string

      var text = printPath(chart.getDrilldownPath());

      // set the chart title

      chart.title().useHtml(true);

      chart.title("Sunburst: Interactivity (Drilling Down and Up)<br><br>" +

                  "Path: <span style = 'color:#990000; font-style:italic'>" + text +

                  "</span><br><br><span style='font-size:12; font-style:italic'>" +

                  "Corporate Structure</span>");

    });

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});

​

/* convert the current drilldown path to a string */

function printPath(path) {

  /* go through the array of data items

  and use the get() method to obtain the "name" field */

  var text = "";

  for (i = 0; i <  path.length; i++){ 

    text += path[i].get("name") + "\\";

  }

  return text;

}

// drill down to a data item

function drillToItem() {

  /* locate an item in the data tree

  and get it as an object */

  var item = treeData.search("name", "Technical");

  // drill down to the item

  chart.drillTo(item);

}

​

// drill up a level

function drillUpALevel() {

   chart.drillUp();

}