12

我正在使用 d3.behavior 将缩放事件附加到我的 SVG，因此使用鼠标滚轮我可以获得带有平移和缩放的缩放事件，然后我使用它来设置元素的变换属性。

似乎 zoom.scale 值在某处是持久的，因此每次使用鼠标滚轮时，它总是包含正确的缩放值，并考虑到所有先前的缩放事件。这很酷，但我需要一种清除该值的方法，比如重置缩放按钮。当用户点击按钮时，下一次他滚动缩放元素将再次从其原始大小缩放。

那么 D3 将这个值存储在哪里以及如何重置它呢？

更新：
这个问题还有另一个方面：如果我以编程方式设置“变换”属性来进行缩放变换，缩放事件将不会考虑这些。因此，如果我稍后使用鼠标滚轮进行缩放，我会感到困惑，因为我会破坏原始转换。因此，我需要一种方法来以编程方式设置，而不仅仅是重置缩放事件的“平移”和“缩放”值，无论它存储在哪里。

4

2 回答 2

14

缩放比例存储在您的缩放对象中。我猜你有一行代码看起来像：

var zoom = d3.behavior.zoom()

从该对象获取比例很简单：

zoom.scale()

要缩小 x2：

zoom.scale( zoom.scale()/2 )

翻译的工作方式相同，使用zoom.translate()和zoom.translate( [x, y] )获取和设置。

要使显示变换与缩放保持同步，只需确保在更新一个时，另一个也会更新。

于 2013-06-19T17:55:41.107 回答
0

在 D3 v5 中有一种更简单的方法。您可以调用selection.call(zoom.transform, d3.zoomIdentity);重置缩放，甚至应用平滑过渡，如selection.transition().duration(750).call(zoom.transform, d3.zoomIdentity);.

来源：

于 2019-04-04T19:19:02.030 回答