D3移除'缩放'彻底地

D3 remove 'zoom' completely

本文关键字:缩放 D3 移除      更新时间:2023-09-26

我正在尝试从svg中完全删除缩放。

zoom = d3.behavior.zoom()
    .x(userNodesScaleX)
    .y(userNodesScaleY)
    .on("zoom", zoomed);
userMapSvg.call(zoom);

这在SVG的顶部添加了一个"rect.background",防止鼠标事件到达SVG中的其他元素。

所以我决定完全取消缩放。删除事件,删除矩形。我该怎么做?

当前代码为

removeZoom = d3.behavior.zoom()
    .on("zoom", null);

这不起作用。它只切换事件。

要停止任何将来的缩放以转换页面,请删除侦听器:

zoom.on("zoom", null)

撤消以前的缩放转换:

zoom.scale(1).translate([0,0]).event(userMapSvg)

http://bl.ocks.org/1wheel/6414125

bl.ocks顶部的按钮显示了这两种行为。

如果两者都不是你想要的,那么发布一个问题的工作示例将非常有帮助。您可能还需要查看缩放文档。

我发现的另一种工作方法是将缩放的范围以及.extenttranslateExtent设置为width和height元素(从而完全禁用缩放)。当然,也可以将scaleExtent设置为[1,1]。

尝试

userMapSvg.on(".zoom", null);