“Pinning"D3力向图中的节点

我构造了一个规则的"网格"，它将节点放置在网格上间隔均匀的点上。然后，通过随机化linkDistance，我可以"搅动"网格，使其不那么规则。

我想"固定"所有的边缘点，这样它们就不会移动——只留下内部的点受力布局的影响。

我的见解是，因为这是一个规则的四边形网格，任何权重小于4的点都是一个"边缘"点，因此应该被固定。

我认为权重只有在将节点和链接添加到force layout后才会计算出来，所以我通过nodes数组进行forEach ing，将其添加到force layout后，并根据权重有条件地设置fixed属性。

然后，我重新应用nodes属性和start模拟。

。在这个例子中，我附加了所有移动的点。

force = d3.layout.force()
                .size( [w, h ] )
                .nodes( nodes )
                .links( links )
                .linkDistance( function( d ){ return Math.random() * GRID_SPACING; } )
                .linkStrength( 1 )
                .charge( 0 )
                .gravity( 0 )
                .friction( .5 )
                .on( "tick", function() {
                    d3links.attr("x1", function(d) { return d.source.x; })
                        .attr("y1", function(d) { return d.source.y; })
                        .attr("x2", function(d) { return d.target.x; })
                        .attr("y2", function(d) { return d.target.y; });
                    d3nodes.attr("cx", function(d) { return d.x; })
                        .attr("cy", function(d) { return d.y; });
                } );
            // "Pin" all the edge nodes.
            nodes.forEach( function( node ){
                if ( node.weight < 4 ){
                    node.fixed = true;
                }
            } );
            force.nodes( nodes ).start();