Barista: [图表] 实时数据的滚动问题

创建于 2020-08-06  ·  4评论  ·  资料来源: dynatrace-oss/barista

错误报告

预期行为

滚动不应受实时图形的影响。

当前行为

带有实时数据的条形图会产生滚动问题。

重现步骤

二手版本:

  • 打字稿:3.8.3
  • @angular/cdk :9.2.4
  • @dynatrace/barista-components :7.6.0

附件

scroll-bug

P4 bug needs discussion

最有用的评论

@lukasholzer我想协助修复错误,但我对咖啡师代码库和高图的了解非常有限。 另外,结对编程会议对我来说听起来不错。 也许让我们讨论一下 Slack 的时间。

所有4条评论

这可能再次与#1410 中概述的事情有关。

设置系列数据时,调用图表更新函数:
https://github.com/dynatrace-oss/barista/blob/24647e8c15b388cd128ba102fe9f6cf1ffbb4620/libs/barista-components/chart/src/chart.ts#L232 -L236

在这个更新函数中,我们需要销毁当前图表对象并重新实例化它。 Highcharts 有一个更新功能,虽然这不会让消费者更新系列或图表选项的所有属性。 这在过去一直导致问题,这就是我们在 6df1df81f9f935e6185505757893b4a4ba965099 中实现重新实例化功能的原因。

在更改之前,更新函数看起来像这样,其中新的系列和选项被传递给Highcharts.update函数。
https://github.com/dynatrace-oss/barista/blob/dd7fa6f35daa06593081a9700c74fe50757f77ef/src/lib/chart/chart.ts#L543 -L553

在重建期间的一小段时间内,图表元素的高度将为 0,这会导致重新滚动。
@TannerGilbert作为一种解决方法,这可以通过在容器或图表本身上设置高度来防止回流来规避:
https://stackblitz.com/edit/scroll-bug-mvactj?file=src%2Fapp%2Fapp.component.scss

@ffriedl89 @lukasholzer这个问题的一个解决方案是在 update 方法中读取图表的当前高度并将其设置到宿主元素上,并在更新后再次删除它。 但我担心这会导致一些副作用。 你怎么认为?

是的,关于副作用,我不确定,因为我们总是在重置高度后检查选择区域中的this._chart._afterRender (例如应该触发此主题)。

我认为最好的方法是对其进行测试以深入了解它是如何改进的。

@TannerGilbert您想将此修复程序贡献给库吗? 当然,即使是结对编程会话,我们也可以为您提供帮助。

@lukasholzer我想协助修复错误,但我对咖啡师代码库和高图的了解非常有限。 另外,结对编程会议对我来说听起来不错。 也许让我们讨论一下 Slack 的时间。

转移到内部问题跟踪

此页面是否有帮助?
0 / 5 - 0 等级

相关问题

beeme1mr picture beeme1mr  ·  7评论

Sherif-Elhefnawy picture Sherif-Elhefnawy  ·  7评论

ffriedl89 picture ffriedl89  ·  8评论

subarroca picture subarroca  ·  14评论

schobocop picture schobocop  ·  13评论