D3：在绘制和重绘一系列矩形时，我可以获得更好的性能吗？

Question

我通过将矩形绑定到我的数据（时间和值），使用 d3 创建了一个线性热图：

每个热图可以包含数百个（在某些情况下是数千个）<rect> 元素。浏览器最初可以毫无问题地绘制它们，但是当我使用 d3 轴（缩放行为和程序化重绘）沿着时间线移动时，我发现我的转换中存在巨大的性能问题（已知的 SVG 缺点）。

有什么办法可以解决这个问题吗？使用具有相同数量的<stop> 元素的<linearGradient> 会改善情况吗？我需要使用画布而不是 SVG 吗？

谢谢！

Answer 1

linearGradient 可能无济于事，因为您仍然需要为每个停靠点添加一个 DOM 元素。帆布听起来像是要走的路。