d3 overlay对象mousedown事件处理

Question

我最近使用d3.js进行网络拓扑

它具有平移和缩放，对象拖动，线条绘制功能。

我现在已经实现了所有功能，但是存在问题。

当我在主svg上画线时，画得很好。

但是如果我想开始绘制对象（rect或某些图像），它就无法正常工作。

因为对象拖动功能吞下'mousedown'事件。

[Main svg]
mainSvg
       .on('mousedown', function mouseDown() {
                  // make object(line)
                })
                .on('mousemove', function mouseMove() {
                  // drawing line
                  // update line's x2, y2 coordinates
                })
                .on('mouseup', () => {
                  // drawing end
                });
[Object]
 .call(d3.drag()
                    .on('start', function dragStart() {
                    // make active state
                    })
                    .on('drag', function dragging(d) {
                    // update object's x,y coordinates
                    })

所以如果我打开'draw'模式，它可以将'mousedown'事件发送给主svg吗？

在绘制模式期间，我想画线而没有任何中断。（如MS“PowerPoint”）

有没有解决方案，还是需要更改事件处理？

感谢您阅读我的问题。

Answer 1

我解决了自己。

我的解决方案是

d3.selectAll('objects').style('pointer-events', 'none);

在绘图模式下，我关闭所有可点击的对象。