嗯,我已经让它工作了,但不知何故,现在测试时它不再工作了。因此,在我的项目中,我有一个 map ,可以缩放并且可拖动。放大或拖动时,您始终可以单击重置按钮来重置整个演示文稿。效果很好。
所以缩放定义:
var g = svg.append("g");
var zoom = d3.behavior.zoom()
.translate([0, 0])
.scale(1)
.scaleExtent([1, maximumZoom])
.on("zoom", zoomed);
svg.call(zoom);
并且缩放功能是:
g.attr("transform", "translate([0,0]).scale(" + 1 + ")");
zoom.translate([0, 0]);
zoom.scale(1);
单击“重置”按钮后,重置即可正确完成。但是,当现在缩放或拖动到任何地方时,您实际上会看到它是旧的缩放和位置。
但奇怪的是:
zoom.translate([0, 0]);
zoom.scale(1);
应该可以解决这个问题。正如我 1 个月前所说,它工作正常。
此外还有缩放功能:
function zoomed() {
g.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
}
最佳答案
我不是 100% 确定,但似乎调用缩放事件,或者假设稍后在svg 元素正在解决这个问题。
所以只需调用
zoom.on("zoom", zoomed);
svg.call(zoom);
一切都完成后。我将其放入加载 map 的函数中。现在它又可以正常工作了。
您可以看到网站here .
关于javascript - D3 缩放未正确重置缩放状态和平移位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28638126/