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 () {

​

  // data

  data = anychart.data.set([

    {x: "P1", value: 10},

    {x: "P2", value: 2},

    {x: "P3", value: 15},

    {x: "P4", value: 10},

    {x: "P5", value: 15}

  ]);

​

  // set chart type

  var chart = anychart.area();

​

  chart.title("Append Point Demo");

​

  // set data

  var area = chart.splineArea(data);

​

  // set container and draw chart

  chart.container("container").draw();

});

​

// function, if listener triggers

function addPoint() {

  // first index for new point

  newIndex = (data.mapAs().getRowsCount())+1;

​

  // append data

  data.append({

​

    // x value

    x: "new P" + newIndex,

​

    // random value from 1 to 100

    value : Math.floor((Math.random() * 100)+ 1)

  });

};