Question

我想在缩放/平移的同时实现树节点选择。考虑到缩放/平移会与使用鼠标（拖动）选择节点冲突实现为两个独立的侦听器，我可以使用CTRL切换键盘按钮。像这样：

function toggleSelectZoom() {
    if (useZoom) {
        useZoom = false;
        zoomListener.on("zoom", null);
        container.classed("select", true)
            .on("mousedown.select", startNodeSelection)
            .on("mousemove.select", nodeSelection)
            .on("mouseup.select", endNodeSelection);
    } else {
        useZoom = true;
        container.classed("select", false)
            .on("mousedown.select", null)
            .on("mousemove.select", null)
            .on("mouseup.select", null);
        zoomListener.on("zoom", zoom);
    }
}

document.onkeydown = function(e) { if (e.ctrlKey) { toggleSelectZoom(); }};

但是有一个问题：切换到缩放/平移模式后在选择模式下绘制选择框，树（开始平移时）跳转到它的位置将在缩放/平移模式下进行相同的操作。这是一个小提琴http://jsfiddle.net/PSVW6/2/

Answer 1

问题是缩放行为仍会更新其内部状态，即使您没有对其进行操作。要解决，您基本上有两种选择。

如果不以这种方式处理事件，请重置缩放行为的内部状态。这需要您自己跟踪缩放/翻译状态。
不将缩放行为附加到整个SVG，而只附加到元素本身。这样，只有当光标位于元素上并在其他位置选择时，您才能进行缩放/平移。这将消除处理程序中切换逻辑的需要，因为这两组事件将是分开的。

这取决于您的特定应用，其中一种解决方案更适合。

D3将选择与缩放/平移相结合

1 个答案: