javascript – 在D3强制定向布局中,如何在不拖动的情况下以编程方式定位固定节点？

在this question的答案中,mbostock指出“如果一个节点是固定的,它只能通过拖动而不是通过模拟来移动.”

如果我想以编程方式定位节点,或者通过设置d.x和d.y值,该怎么办？到目前为止,我的尝试失败了.我尝试了d.x和d.y的明显设置,但固定节点会忽略这些值.我还尝试暂时“取消修复”,重绘,然后“重新修复”节点,但这也不起作用 – 节点在下一个节拍时神奇地重置为其原始位置.

这是后一种方法的running example.

这是该代码的关键位,在点击时执行：

function explicitlyPosition() {
  node.each(function(d) {
    d.x = 0;
    d.y = 0;
    d.fixed = false;
  });
  tick();
  node.each(function(d) {
    d.fixed = true;
  });
  force.resume();
}

有没有办法使用我尝试过的方法或类似的方法来做到这一点？或者我可以在D3中使用完全不同的图形布局,但我理想地希望我的图形的大部分以力导向的方式布局.

谢谢！

解决方法:

当您触发勾选时,节点的先前位置用于确定新位置,并存储在px和py属性中.如果更改这些属性,则运行tick会将x和y属性更新为这些值.

Fiddle.

从本质上讲,您的节点将在重绘时神奇地修复新值,而不是神奇地修复回旧值.

标签：javascript,d3-js,force-layout
来源： https://codeday.me/bug/20190728/1561598.html