javascript – 修复D3 Force Directed Layout中的节点位置

我希望我的力导向布局中的一些节点忽略所有力并基于节点的属性保持在固定位置,同时仍然能够被拖动并在其他节点上施加排斥并保持其链接线.

我觉得它会像这样简单：

force.on("tick", function() {
    vis.selectAll("g.node")
        .attr("transform", function(d) {
            return (d.someAttribute == true) ?
               "translate(" + d.xcoordFromAttribute + "," + d.ycoordFromAttribute +")" :
               "translate(" + d.x + "," + d.y + ")"
        });
  });

我还试图手动设置每个节点的节点的x和y属性,但是如果它受到力的影响,则链接继续浮动到节点所在的位置.

显然,我对这应该如何运作有一个基本的误解.如何在一个位置修复节点,同时保持链接并仍然允许它们可拖动？

解决方法:

将所需节点上的d.fixed设置为true,并将d.x和d.y初始化为所需位置.这些节点仍然是模拟的一部分,您可以使用正常的显示代码(例如,设置变换属性);但是,因为它们被标记为固定,所以它们只能通过拖动而不是通过模拟来移动.

有关更多详细信息,请参阅强制布局文档(v3 docs,current docs),另请参阅根节点在this example中的定位方式.

标签：javascript,d3-js,data-visualization,force-layout,d3-force-directed
来源： https://codeday.me/bug/20190916/1807642.html