Force directed graph: drifting
This force graph drifts while the simulation is running.
What happens is that every tick adds 1 to the x
and y
position of the centering force forceCenter
, so the graph slowly drifts off the screen.
Here’s the key bit of code:
function tickActions() {
//update circle positions each tick of the simulation
node
.attr("cx", function(d) { return d.x; })
.attr("cy", function(d) { return d.y; });
//update link positions
//simply tells one end of the line to follow one node around
//and the other end of the line to follow the other node around
link
.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; });
//adds 1 to the center position
center_x += 1;
center_y += 1;
//updates the center position
center_force.x(center_x);
center_force.y(center_y);
}
Hope you found that useful! Click here to view to the rest of the force directed graph series.