This page is a reference for viewers of my Force Layout Graphs in D3 course on Pluralsight.com
If you don't have an account on Pluralsight you can get a free trial here: Free Trial on Pluralsight.com
Applying Distance to Links
linkDistance
If distance is specified, sets the target distance between linked nodes to the specified value. default is 20
[code]
var force = d3.layout.force()
.size([width, height])
.nodes(nodes)
.links(links)
.on(“tick”, tick)
.linkDistance(param)
.start();
[/code]
Unequal Distance
When two or more nodes have different distance settings. This is common in network graphs which represent physical locations.
Example:
[code]
var links = [
{ source: 0, target: 1, distance: 100 },
{ source: 1, target: 2, distance: 200 },
{ source: 2, target: 0, distance: 300 }
];
[/code]
Applying Strength to Links
If strength is specified, sets the strength (rigidity) of links to the specified value in the range [0,1]. Specifically this affects the linkDistance value.
Example:
[code]
// create the force layout graph
var force = d3.layout.force()
.size([width, height])
.nodes(nodes)
.links(links)
.on(“tick”, tick)
.linkDistance(width/3)
.linkStrength(strength)
.start();
[/code]