Question

我有一个类似于此的力量网络：

按下按钮，我将节点转换到相同的位置：

function positionnodes(){

     force.stop();
     nodes.each(function(d){
         d.fixed = true;
         d.x = 100;
         d.y = 100;
     }).transition().duration(1000).attr("transform", function(d)
    {

    //console.log(d.hasRelationship);
    //console.log(d.y);
    return "translate(" + 100 + "," + 100 + ")"; 

    });

    edges.transition().duration(1000).attr("x1", function (d) {

        console.log(d.source.x)
        return d.source.x;
    })
    .attr("y1", function (d) {console.log(d.source.y)
        return d.source.y;
    })
    .attr("x2", function (d) {console.log(d.target.x)

        return d.target.x;
    })
    .attr("y2", function (d) {console.log(d.target.y)
        return d.target.y;
    });
    //setTimeout(function(){ force.start();},1000);

}

我的问题是，在我这样做之后我去拖动节点，节点位置跳回到它的前一个，即使我已经设置了它。好像d.x / d.y没有更新。

有什么想法吗？

Answer 1

拖动事件将触发force.start，然后将重新计算所有节点的（x，y）。要避免触发force.start，您需要覆盖force.drag的事件处理程序，请参阅 here

行。这是一个工作示例：Working Example。核心部分在这里：

var drag = force.drag()
                .origin(function(d) {
                    var t = 
d3.transform(d3.select(this).attr("transform")).translate;
                    return {x: t[0], y: t[1]};
                })
                .on("drag.force", function(d) {
                    var cord = [0,0];
                    cord = d3.mouse(this);
                    d.x = cord[0];
                    d.y = cord[1];
                    tick();
                });

D3，节点转换后拖动不正常

1 个答案: