Stop Force Layout on d3js and start free dragging nodes

d3.js force-layout
riccardo.tasso picture riccardo.tasso · May 15, 2013 · Viewed 10.2k 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

Since my own data are really a mess, I'd like to stop the layout and move nodes by dragging them manually. I'd also like that the movement of a node doesn't change the position of others. And it's necessary that links become longer, to reach the node which has been moved.

Is there a simple way to do this?

Answer

riccardo.tasso picture riccardo.tasso · May 16, 2013

At the end I found this related question which implements a solution which I'll adopt.

D3 force directed graph with drag and drop support to make selected node position fixed when dropped

http://bl.ocks.org/norrs/2883411

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