繁体   English   中英

d3覆盖对象mousedown事件处理

[英]d3 overlay object mousedown event handling

我最近正在使用d3.js制作网络拓扑

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

我现在已经实现了所有功能,但是有一个问题。

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

但是,如果我要开始在对象(矩形或某些图像)上绘图,则无法正常工作。

因为对象拖动功能会吞下“ 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
                    })

因此,如果我打开“绘制”模式,是否可以将“ mousedown”事件调度到主svg?

在绘制模式下,我要绘制线而没有任何中断。(例如MS“ PowerPoint”)

有什么解决方案还是我需要更改事件处理?

感谢您阅读我的问题。

我解决了自己。

我的解决方案是

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

在绘图模式下,我关闭了所有可单击的对象。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM