Javascript D3地图在Chrome上的平移和缩放性能

为了让事情变得更简单，下面是我所拥有的一些资料

试试看

在FireFox（版本35.0.1）中，平移地图。单击并按住地图上的任意位置，然后快速左右移动。平移运动应快速平稳

现在在Chrome中尝试同样的功能，你会发现它并没有那么平滑！它有点脆/滞后。我在IE和Opera的最新版本中也发现了它

顺便说一句，如果你注释掉了这个样式块，那么行为会突然变得平滑，不再滞后！当然，你不会得到一张漂亮的地图

#map path {
    fill: #C9DCC9;
    stroke: #066860;
}

那又怎样？

首先，如果有人能在他们的电脑上确认这一行为，我将不胜感激。我使用的是Windows 8.1，有所有最新的更新

---

那么，为什么这种行为没有发生在其他使用D3的地图上呢？例如，行为流畅！这与多边形的复杂性有关吗？

为了解决这个问题，我简化了地图的路径。我在上使用了

-simplify

功能

经过路径简化后，在Chrome、Firefox、Opera和IE11中，地图的平移和缩放非常平滑

TopoJson是一个节点包，因此您需要为TopoJson安装node和许多其他依赖项才能使其在windows上工作。如果你幸运的话，它可以在Windows上为你工作

我很不走运，所以我去创建了一个运行Ubuntu的虚拟机，在那里，节点设置非常简单，我在5分钟内完成了我想做的事情。与尝试在Windows上运行此功能的天数相比

---

无论如何，希望这能有所帮助。：）

我可以确认，在Chrome40/Win7中，平移/缩放相当滞后，如果去掉笔划，滞后就会消失（请注意，链接到的其他贴图不包括笔划）。我认为您的代码中没有问题：您正在使用全局变换来进行平移和缩放，这应该尽可能优化。Chrome开发工具确认了延迟，并将其归因于缓慢的绘制周期和重复的更新/复合层周期。对于平移，它似乎还在触发重绘之前缓冲多个事件。最佳建议：向Chrome.P.S.提交错误报告。我刚刚在IE11上测试过，性能没有Firefox好，但肯定没有Chrome差。Opera使用与Chrome（闪烁渲染引擎）相同的渲染代码，因此归档将解决这两个问题。（转换使用

requestAnimationFrame（）

）似乎有助于缩放，但对平移没有帮助。Chrome似乎正在处理一个接一个的mousemove事件，其间没有时间重新粉刷屏幕。我已经，请投上一票以引起他们的注意：）这让我发疯了。事实上，舍入路径数据对我来说很有效。干杯