【发布时间】：2014-02-08 13:56:18
【问题描述】：
使用 d3 在 Leaflet 地图上绘制 SVG 人工制品是获得结合 d3 优势的实体地图控制器的简单方法。有许多示例和指南来说明如何实现这一点，两种主要方法似乎是：
在 Leaflet 的“覆盖窗格”上附加一个新的 SVG 元素，如 Bostock 所示：http://bost.ocks.org/mike/leaflet/
实施一个自定义矢量切片层，该层与 Leaflets 原生切片层生态系统挂钩，正如 Nelson Minar 所展示的那样：http://bl.ocks.org/NelsonMinar/5624141
第一种方法通过附加一个传单类来避免传单基于比例的缩放，以便在缩放发生时隐藏任何 d3 元素。当缩放动画结束时，元素坐标被重新计算并重新绘制，之后隐藏类被移除以再次暴露元素。这可行，但提供的放大/缩小体验不如 Leaflet 的原生 GeoJSON 层，因为后者支持动画缩放。
第二种方法不包含任何解决缩放行为的特定于实现的代码，但无论如何都可以工作！ d3 元素在动画缩放期间进行缩放，然后整齐地替换为下一个缩放级别向量。
我想要实现的是两者的结合。我想绘制基于 Geo/TopoJSON 的非基于瓦片的矢量，这些矢量在放大/缩小期间动画。我一直在摆弄使用不同的传单 css 类、不同的事件挂钩以及以多种方式附加和/或重用 SVG 元素，但尚未实现与使用 Leaflet 的本机 GeoJSON 向量时所经历的行为类似的行为层。我不想使用本机层的原因是我想利用大量其他 d3 功能，这些功能根本不是 Leaflet 实现的一部分。
问题：有没有人在使用非平铺矢量结合 Leaflet 和 d3 时实现动画缩放？如果是这样 - 如何？
【问题讨论】：
-
您可能想查看 (this example) d3 地图上的动画缩放。请注意，它比其他一些 d3 缩放示例要慢，因为它在缩放时重新计算地图投影，而不是仅使用图形变换来缩放图像。我对 Leaflet 没有任何经验，但是如果您可以使用 Javascript 调用设置比例/投影，那么您可以在重新计算 d3 地图投影的同时从 d3 缩放功能中执行此操作。但同样，每一步都需要大量重新计算，因此缩放可能不会非常流畅。
-
感谢您的提示，但是是的，我认为解决方案必须基于纯图形方法进行实际缩放，而不是在过渡期间计算地理坐标。