Spline Update (special Chart)

Spline차트에서 데이터를 실시간으로 업데이트합니다.

Example

var options = {
  chart: {
    type: "spline"
  },
  xAxis: {
    type: "datetime"  // x값이 시간(밀리초)
  },
  series: [{
    name: "실시간 데이터",
    data: []
  }]
};
myChart.setOptions(options, {append: true, redraw: true});
var series = myChart.series(0);
// 최대 표현 갯수 지정
var maxDataPoints = 20;
// interval을 활용하여 1초마다 데이터를 추가
this.refreshInterval = setInterval(function () {
  var x = (new Date()).getTime(), // 현재시간
      y = Math.random();          // 랜덤 데이터
  // 최대 갯수에 도달하면 shift로 가장 오래된 포인트를 지우면서 추가
  series.addPoint([x, y], {redraw: true, shift: series.getData().length >= maxDataPoints});
}, 1000);

// 포인트가 추가된 후 처리가 필요하면 addPoint 이벤트를 사용합니다. (7.3.1.18 이상)
myChart.setEventListener("addPoint", function(event) {
  console.log("추가된 포인트: " + event.point.x + ", " + event.point.y);
});

Since