用Highcharts如何动态向一个序列添加点-示列讲解

动态向 Highcharts 序列添加点通常用series.addPoint()。

最常见写法是：

Highcharts.chart('container',{chart:{type:'line'},title:{text:'动态添加点'},xAxis:{type:'datetime'},series:[{name:'随机数据',data:[[Date.UTC(2026,7,5,10,0,0),10],[Date.UTC(2026,7,5,10,1,0),12]]}]});setInterval(function(){constchart=Highcharts.charts[0];constseries=chart.series[0];constx=(newDate()).getTime();consty=Math.round(Math.random()*100);series.addPoint([x,y],true,false);},1000);

参数说明

series.addPoint(point, redraw, shift, animation)

• point：要添加的数据点，例如12、[x, y]，或对象{ x, y }
• redraw：是否立即重绘，通常设为true
• shift：是否移除最早的一个点，适合实时曲线
• animation：是否动画更新

实时折线常见用法

如果你希望图表像监控面板一样持续滚动，可以用：

series.addPoint([x,y],true,true);

这样每添加一个新点，就会移除最旧的点。

官方文档

• series.addPoint: https://api.highcharts.com/class-reference/Highcharts.Series#addPoint
• 实时数据示例: https://www.highcharts.com/docs/working-with-data/live-data