Highcharts 动态图

 


每秒更新曲线图

chart.events

chart.event 属性中添加 load 方法(图表加载事件)。在 1000 毫秒内随机产生数据点并生成图表。

chart: {
   events: { load: function () { // 图表每秒更新一次 var series = this.series[0]; setInterval(function () { var x = (new Date()).getTime(), // 当期时间 y = Math.random(); series.addPoint([x, y], true, true); }, 1000); } } }

实例

文件名:highcharts_dynamic_spline.htm

<html>
<head>
<meta charset="UTF-8" /> <title>Highcharts 教程 | 菜鸟教程(runoob.com)</title> <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> <script src="http://code.highcharts.com/highcharts.js"></script></head> <body> <div id="container" style="width: 550px; height: 400px; margin: 0 auto"></div> <script language="JavaScript"> $(document).ready(function() { var chart = { type: 'spline',      animation: Highcharts.svg, // don't animate in IE < IE 10. marginRight: 10,      events: { load: function () { // set up the updating of the chart each second var series = this.series[0]; setInterval(function () { var x = (new Date()).getTime(), // current time y = Math.random(); series.addPoint([x, y], true, true); }, 1000); } } }; var title = { text: 'Live random data' }; var xAxis = { type: 'datetime', tickPixelInterval: 150 }; var yAxis = { title: { text: 'Value' }, plotLines: [{ value: 0, width: 1, color