使用矩形在可缩放地图顶部选择节点在D3中

问题描述

[[[这是使用d3 v5]]

D3.zoom（）自动将滚轮和鼠标单击映射到缩放地图的操作。我希望能够在地图区域中绘制一个矩形，以选择出现在地图顶部的节点。我需要知道如何为mousedown，mousemove，mouseup添加处理程序，以便可以跟踪矩形的位置。

我尝试了以下方法，但是从不调用mousedown回调。

如果删除.call(zoom)，则会调用mousedown回调，但是e是undefined。我可以使用d3.event访问该事件，所以这不是问题。

如果在.call(zoom)鼠标*'（cb）`调用之后移动.on(，我会看到鼠标向下，但没有鼠标向上，只有一个鼠标移动。

我可以理解首先添加鼠标回调的方法，但是我不明白为什么其中一些被屏蔽而另一些没有被屏蔽。显然，我需要一些帮助来理解这一点。

        var zoom = d3.zoom()
            .scaleExtent([0.1,10])
            .filter(() => !d3.event.ctrlKey) // Don't zoom/pan when ctrl is pressed
            .on("zoom",zoomed)
        ;

        container
            .call(zoom)
            .on('mousedown.zoomrect',e=>console.log('zoom',e))
            .on('mouseup.zoomrect',e=>console.log('zoom up',e))
            .on('mousemove.zoomrect',e=>console.log('zoom move',e))
        ;

在矩形中定位节点是一个单独的问题，但是我相信我可以处理投影和变换。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

geo zoom