在强制布局上拖动会阻止其他鼠标侦听器

时间:2013-01-18 12:13:47

标签: d3.js mouseevent drag force-layout mouseup

我想在d3.js强制布局中启用拖动。当拖动一个圆圈并释放鼠标按钮时,我想通过回调调用一个特定的函数,如下所示:

this.force = d3.layout.force()
    .nodes(this.nodes)
    .size([this.width, this.height]);

// enable dragging
this.circle
    .call(this.force.drag)
    .on("dragend", function() {
        console.log("You should see this, when releasing a circle.");
    })
    .on("mouseup.drag",function(d,i) {
        console.log("Or see this.");
    });

不幸的是,force.drag处理程序永远不会触发/消耗该事件。 那么如何在拖动结束时在d3强制布局中执行给定的回调函数?

1 个答案:

答案 0 :(得分:3)

您未在此处"dragend"调用this.force.drag事件。 这还取决于您如何定义this.force.drag

这应该对你有用

myCustomDrag = d3.behavior.drag()
    .on("dragstart", function(d,i){
        //do something when drag has just started
    })
    .on("drag", function(d,i){
        //do something while dragging
    })
    .on("dragend", function(d,i){
        //do something just after drag has ended
    });

在上面的代码中,只需在要使用此拖动行为的元素(此处为圆圈)上使用call(myCustomDrag)