Does d3.js force layout allow dynamic linkDistance?

d3.js force-layout
riccardo.tasso picture riccardo.tasso · May 15, 2013 · Viewed 9.7k times · Source

I'm using the force layout to represent a directed unweighted network. My inspiration comes from the following example: http://bl.ocks.org/mbostock/1153292

enter image description here

My problem is that in my case there much more links between nodes and I have the feeling that giving a fixed linkDistance, which is always the same, is a very big constraint for my layout.

Is it possible to set a dynamic linkDistance, such that a link grows in length if it's useful to reduce link crossing inside the graph?

Answer

Lars Kotthoff picture Lars Kotthoff · May 15, 2013

From the documentation:

force.linkDistance([distance])

If distance is specified, sets the target distance between linked nodes to the specified value. If distance is not specified, returns the layout's current link distance, which defaults to 20. If distance is a constant, then all links are the same distance. Otherwise, if distance is a function, then the function is evaluated for each link (in order), being passed the link and its index, with the this context as the force layout; the function's return value is then used to set each link's distance. The function is evaluated whenever the layout starts. Typically, the distance is specified in pixels; however, the units are arbitrary relative to the layout's size.

Note that the link distance is still adjusted as the layout runs. You may also find setting linkStrength() useful.

Related questions

How do I remove all children elements from a node and then apply them again with different color and size?

So I have the next force layout graph code for setting nodes, links and other elements: var setLinks = function () { link = visualRoot.selectAll("line.link") .data(graphData.links) .enter().append("svg:line") .attr("class", "link") .style("stroke-width", function (d) { return nodeStrokeColorDefault; }) .…

Read More
Fix Node Position in D3 Force Directed Layout

I want some of the nodes in my force-directed layout to ignore all forces and stay in fixed positions based on an attribute of the node, while still being able to be dragged and exert repulsion on other nodes and …

Read More
Is there a way to zoom into a D3 force layout graph?

D3 has a force directed layout here. Is there a way to add zooming to this graph? Currently, I was able to capture the mouse wheel event but am not really sure how to write the redraw function itself. Any …

Read More