html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // create data

    var data = [

      {x: "John Doe", value: 1},

      {x: "Richard Roe", value: 1},

      {x: "Larry Loe", value: 1},

      {x: "Marta Moe", value: 1},

      {x: "Jane Poe", value: 1},

      {x: "Norma Noe", value: 1},

      {x: "William Woe", value: 1}

    ];

​

    // create a chart and set the data

    chart = anychart.pie(data);

​

    // set the layout of the legend

    chart.legend().itemsLayout("vertical");

​

    // set the position of the legend

    chart.legend().position("right");

​

    // enable and configure the legend title

    var title = chart.legend().title();

    title.enabled(true);

    title.text("Number of Employees: " + chart.getStat("count"));

    title.orientation("left");

    title.padding(5);

    title.fontColor("#96a6a6");

    title.fontSize(12);

    title.fontWeight(600);

​

    // enable and configure the title separator

    var separator = chart.legend().titleSeparator()

    separator.enabled(true);

    separator.orientation("left");

    separator.height(4);

    separator.stroke("#96a6a6", 2);

    separator.fill("none");

    // set the chart title

    chart.title("Legend: Title and Separator");

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});