如何解决FlotChart setupGrid不会更新X轴
我正在处理实时图表,并且正在将新数据推送到数组,但是即使调用setupGrid()和draw()之后,该图表也不会更新X轴数据。
this.plot = $.plot($("#chart"),[this.plotData],this.plotOptions);
function updateChart() {
this.plotData.push([this.plotIdx,this.serverinfo.cpu])
this.plot.setData([this.plotData]);
this.plot.setupGrid();
this.plot.draw();
this.plotIdx++;
setTimeout(() => this.updateChart(),10000);
}
我不确定我在做什么错
解决方法
自己解决。看来setupGrid()
不会计算数据集并不会自动更新轴。您需要自己更新x轴范围。因此,要解决此问题,我要做的是:
function updateChart() {
this.plotData.push([this.plotIdx,this.serverinfo.cpu])
this.plot.setData([this.plotData]);
//Used API to manually update x-axis range and it works
var axes = this.plot.getAxes();
axes.xaxis.options.max = this.plotIdx;
this.plot.setupGrid();
this.plot.draw();
this.plotIdx++;
setTimeout(() => this.updateChart(),10000);
}
我使用了Flot的getAxes()
API来获取轴并更新了x轴的最大范围,并且可以正常工作。 :)
特别感谢此JSFiddle:https://jsfiddle.net/jfazler/gQaUz/
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。