html, body, #container {

    width: 100%;

    height: 100%;

    margin: 0;

    padding: 0;

}

anychart.onDocumentReady(function () {

​

    // create data

    var data = [

      {x: "John", value: 5000},

      {x: "Richard", value: 5000},

      {x: "Larry", value: 5000},

      {x: "Marta", value: 15000}

    ];

​

    // create a chart and set the data

    chart = anychart.pie(data);

​

    /* prevent the cursor from changing

    when it hovers over the legend */

    chart.legend().hoverCursor("default");

​

    /* listen to the legendItemMouseDown event

    and prevent the default behavior of the legend

    and the legendItemClick event */

    chart.legend().listen("legendItemMouseDown", function(e) {

      e.preventDefault();

      e.stopPropagation();

    });

​

    /* listen to  the legendItemMouseOver event

    and prevent the default behavior of the legend */

    chart.legend().listen("legendItemMouseOver", function(e) {

      e.preventDefault();

    });

​

    /* listen to the pointClick event

    and configure the appearance of the legend item */

    chart.listen("pointClick", function(e) {

      if (e.point.selected()) {

        e.point.set("legendItem", {iconFill: "#455a64"});

      } else {

        e.point.set("legendItem", null);

      }

    });

​

    // set the chart title

    chart.title().useHtml(true);

    chart.title("Events: Chart Points (Single Series)<br><br>" +

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

                "Click on Chart Points");

​

    // set the container id

    chart.container("container");

​

    // initiate drawing the chart

    chart.draw();

});