angular - NGX-Charts气泡图x轴间距问题

Question

我正在开发一个使用 ngx-charts 气泡图的 Angular 应用程序。图表上的内容随着用户缩小时间范围而更新。

我正在使用气泡图在时间线上及时标记某些事件，而不是表示数据，所以我与它的预期用途有一点偏差，但我认为这应该不是太大的问题。

偶尔当图表更新时，我会在 y 轴和 x 轴的开头之间出现很大的差距。图表的开始/结束时间是正确的，我只是对间距有疑问。

我通过将数据推送到新数组中来向图表添加数据，然后将新数组分配给显示的数据数组。

let newData: object[] = [];
newData.push(foo);
displayedData = newData;

我尝试强制重新渲染图表以使数据正确显示。

showChart = false; // this is attached to an *ngIf in the component HTML file
displayedData = [...displayedData];
showChart = true;

图表上的时间正在通过订阅由另一个组件更新的 NGXS 存储值进行调整。

times$.subscribe(times => {
   if (times) {
      xScaleMin = times.start;
      xScaleMax = times.stop;
   }
}

有任何想法吗？提前致谢！

标签： angulartypescriptngx-charts

Answer 1

事实证明，我没有正确删除时间范围之外的数据。随着图表及时向前移动，留下的数据仍在图表上但在xScaleMin值之前。但由于某种原因，旧数据上没有出现气泡。