我尝试使用highcharts实时绘制数据。 但是,当刷新间隔小于1秒时,动画最终会导致渲染问题:
Ex:http://jsfiddle.net/maf23rja/ 测试2:http://jsfiddle.net/maf23rja/3/
我想实现流畅的动画,例如:
http://jsfiddle.net/maf23rja/5/
我能做的最好的事情是禁用动画,并在80ms内创建(重复)数据以生成实时效果。
events: {
load: function () {
var lastValue = 0;
// simulate data from websocket
var series = this.series[0];
setInterval(function () {
lastValue = Math.random();
}, 500);
// Simulate realtime animation
setInterval(function () {
//var x = new Date().getTime();
var x = lastIndex++;
series.addPoint([x, lastValue], true, true, false);
}, 80);
}
}
但我认为这会导致性能和内存消耗问题。