Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can I show a graph using d3 force layout with initial positions set and no movement at all?

I use d3 force layout to construct a graph, and then store the positions of the nodes in a database.

The next time I want to show the graph, I read the positions from the database into the nodes and then I start the force layout.

That causes the layout to move slightly.

Is there I way to show the graph with the stored node positions without calling force.start() at all?

What I want is a "read only" mode to show a stable graph created by someone else earlier.

/Hans

like image 692
hansbrattberg Avatar asked Jun 24 '13 22:06

hansbrattberg


1 Answers

I recommend you to read the documentation of the force layout. It is really good.

As you mentioned, you have to set the px and py attributes for each node. Then, you can set the attribute fixed to true in each node.

This will imply that computing force.start() won't have any effect.


Another thing you can try is to set the alpha value to 0, and then start the simulation:

force.alpha(0)
    .start()

I am not sure whether this method works. Post a jsFiddle if it does not.

like image 152
Christopher Chiche Avatar answered Oct 25 '22 10:10

Christopher Chiche