d3js force node starting position

Question

I want to load every node to it's position and then start force that will move nodes away from each other so they don't overlap. Currently I have working but nodes are moved all over screen at force start and not staying at their initial position when force is started. Is there a way to set initial position and then start collision detection with force?

jsfidle example: http://jsfiddle.net/2eM8Z/

I tried setting cx and cy before defining force but that did not help

Answer 1

In order to initialise the positions of the nodes in a force layout, you need to set the x and y attributes, as this is what the force layout uses -- not cx and cy . If you do that with your current code however, it won't work because the nodes will overlap initially which means that the repulsive forces are too strong. It works fine if you place them a small distance apart to start with.

Complete demo here .