2013-06-19 56 views
9

我使用d3.behavior将缩放事件附加到我的SVG,然后使用鼠标滚轮我可以通过平移和缩放来获得缩放事件,然后使用它来设置元素的transform属性。D3js:如何清除由d3.zoom事件设置的缩放比例?

看起来zoom.scale值在某个地方是持久的,所以每次使用鼠标滚轮时,它总是包含正确的缩放值,同时考虑到所有以前的缩放事件。这很酷,但我需要一种方法来清除该值,例如重置缩放按钮。当用户点击按钮时,下次他滚动缩放时,元素将再次从原始大小缩放。

D3在哪里存储这个值,我该如何重置它?

UPDATE:
这个问题也有它的另一个方面:如果我编程方式设置“变换”属性做缩放变换,缩放事件将不会把这些考虑进去。所以,如果我以后使用鼠标滚轮放大缩小,我很麻烦,因为我可以摧毁原始转换。因此,我需要一种以编程方式设置缩放事件的“翻译”和“缩放”值的方式,而不仅仅是重置,无论它存储在何处。

+1

在d3 google群组论坛上发表类似问题的人的评论:https://groups.google.com/d/msg/d3-js/-qUd_jcyGTw/ksHIZi7baCsJ – mg1075

回答

12

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

var zoom = d3.behavior.zoom() 

获得来自该对象的规模很简单:

zoom.scale() 

要缩小X2:

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

翻译以同样的方式工作,使用zoom.translate()zoom.translate([x, y])进行设置。

要保持显示变换与缩放同步,只要确保更新一个,另一个也更新。

+2

https://github.com/ mbostock/d3/wiki/Zoom-Behavior –

+0

这太棒了!有没有一种方法可以从事件对象中获取此对象?或者我必须明确定义并将其保存为var? –

+0

啊没关系,我想通了,这是d3.event.target对象。感谢您的回答:) –

相关问题