CODEWITHSUNDEEP
d3.jsoverlapforce-layout
khan
khan

Reputation: 137

Avoid overlap/ entangling in d3.js

How do I avoid overlap / entangling of the nodes using force layout in D3.js. The nodes must be a bit far from each other ? These are code changes , the links some times cut each other and some times nodes are too close to each other

force = d3.layout.force()
        .gravity(.2)
        .distance(100)
        .charge(-700)
        .size([700,700]);

Upvotes: 2

Views: 1191

Answers (1)

Elijah
Elijah

Reputation: 4639

It's dependent on your network, there are no fixed rules for making a network visualization display properly. One thing to experiment with is setting linkDistance or charge to be based on the weight value of a node, which indicates the degree centrality of a node (the number of connections it has). Something like:

d3.layout.force()
 .charge(function (d) {return d.weight * -500})

Upvotes: 1

Related Questions