在定向力图中交互式修复节点

Question

我目前正在使用一个相当简单但很大的力量指向图，并且我希望我的用户能够组织图形，但他们在当时看起来合适。要做到这一点，我想让他们交互地修复节点的位置。锁定节点的方法取决于我;我想或者双击节点，或者在鼠标悬停/抓取节点时按下某个键。

我不确定如何做到这一点，找不到任何例子，并非常感谢一些帮助。

非常感谢。

Answer 1

这是一个例子，您可以点击（或拖动）放置后具有固定位置的节点。

var node_drag = d3.behavior.drag() 
     .on("dragstart", dragstart) 
     .on("drag", dragmove) 
     .on("dragend", dragend); 

    function dragstart(d, i) { 
     force.stop() // stops the force auto positioning before you start dragging 
    } 

    function dragmove(d, i) { 
     d.px += d3.event.dx; 
     d.py += d3.event.dy; 
     d.x += d3.event.dx; 
     d.y += d3.event.dy; 
     tick(); // this is the key to make it work together with updating both px,py,x,y on d ! 
    } 

    function dragend(d, i) { 
     d.fixed = true; // of course set the node to fixed so the force doesn't include the node in its auto positioning stuff 
     tick(); 
     force.resume(); 
    } 

Full code here。