D3 + Leaflet，仅在可见时绘制（大数据可见）

Question

为了在一张传单地图上有很多 svg 路径、svg 文本和 svg textpath 元素的合理性能，我想知道 D3 如何处理当前不在屏幕上的元素。

因此，例如，当我放大到华盛顿州等区域时，99.9% 的世界都没有显示 - D3 默认行为是否会绘制所有其他元素？

我的项目基于 Mike Bostocks d3 + leaflet example。没有使用视口/视框属性 - 它是在其他地方完成的吗？感谢您的意见。

Answer 1

我认为这个问题有两个部分

1. 画出屏幕外的 SVG DOM 元素

   正如@LarsKotthoff 所提到的，可能不值得担心这些，因为浏览器在优化它们方面可能会比你做得更好。

2. 处理将导致 SVG DOM 元素从屏幕上绘制出来的数据。

   我认为这是您可以有所作为的地方。如果您有昂贵的数据操作/处理，那么处理不会显示的内容似乎是在浪费周期。我能想到的改善这种情况的唯一方法是尽早确定某些内容是否会出现在屏幕外。如果它要离开屏幕，则在进行任何进一步的数据处理时忽略它。

   但在这些情况下，您需要一种方法来检测它何时移入视野或移出视野，以及是否进行处理（视情况而定）。这可能会导致一些额外的开销，使其不值得这样做。

   您的个人情况将决定这对您的效果如何，但如果您有一个具体的例子，那么这里的用户可能能够协助重构以提高性能。

您还可以做其他事情，例如重新考虑可视化以首先需要更少的元素。根据我的经验，性能并不是真正的问题，直到屏幕上出现如此多的信息，以至于可视化的价值已经降低。去除无关信息可以提高性能并提高对可视化的理解。当然，这是我的特殊经历，肯定有不适用的时候。