动态添加数据时移动自定义电子图表

编程问答 2022-08-11

问题描述

我正在使用SignalR动态更新自定义图表上的数据系列，并希望在添加数据时一起移动xAxis滑块。

当前，我正在基于滑块的最后一个已知位置（使用dataZoom确定最后一个位置）来增量更新dataZoom属性，但这并不是一个很好的解决方案。

在该站点上的动态数据示例中，图表无缝移动（https://echarts.apache.org/examples/en/editor.html?c=dynamic-data2），不幸的是，我的代码没有这样做。

SignalR中的setoptions：

this.chartinstance.setoption({
  dataZoom: [{
    start: this.laststart * 12,end: this.lastend * 12,}],series: [{
    data: this.axisdata
  }]
});

dataZoom：

public chartDataZoom(event: any): void {
  if (event.batch && event.batch.length >= 1) {
    this.zoombatch = event.batch[0];
    this.zoombatch.data = true;        
  }
  else {
    this.laststart = event.start;
    this.lastend = event.end;
  }
}

基于最大的钢筋长度，是否会有更简便的方法。

图表如下：

enter image description here

最早的条目位于左侧，默认情况下，该位置是x轴滑块的位置。

添加新条目后，它们将添加到屏幕外右侧（在屏幕截图中）。

添加新条目时，我是否需要x轴移动，而不管它们当时是否在屏幕上可见？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

echartsechartstypescripttypescripttypescript