Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

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

Example on a force direct graph can be found here: http://bl.ocks.org/950642

How can I easily add support for drag and drop? It should set the node to fixed with current location of where it dropped it. It is important that rest of the nodes still uses the 'force directed mode' to position rest of the nodes in the graph automatically

https://github.com/mbostock/d3/wiki/Force-Layout

I've played around a bit without success, and wondering if anyone is able to give me a quick example on how to add such support as explained above.

like image 815
norrs Avatar asked Jun 05 '12 14:06

norrs


1 Answers

Finally got it working after figuring out it is not ideal to fight with two "drag" listeners (your own, and force.drag) attached to the nodes!

Much better to only have your own "drag"-listener and call tick() manually which is the key feature of getting the force graph to position the nodes for you on every new node position on the node your dragging.

Working example: http://bl.ocks.org/2883411

like image 91
norrs Avatar answered Oct 18 '22 09:10

norrs