nylen / d3-process-map

Web application to illustrate the relationships between objects in a process using d3.js.
MIT License
416 stars 196 forks source link

Position of All Nodes to be remain same when page refreshed #19

Closed hrspandya closed 7 years ago

hrspandya commented 8 years ago

Hi,

We are so happy to use your module in our application,

Question: When we render your module, the position of nodes do not stay in same exact position after refreshing the page,

We notice that currently nodes are positioned in random order every time page is refreshed,

is there a way to keep the position of each node to remain in the same position every time page refreshed,

Please help us if anything can be done to achieve above results,

Much appreciated,

nylen commented 8 years ago

I added the constraints property to the config file for a similar reason. Rather than forcing objects into the same position, constraints can be used to "push" objects towards their desired position. I think this is a good balance between letting the force layout work naturally and encouraging the application to appear the same way each time.

If you really want to force everything to be in the same position each time, though, here is the relevant section of the d3 documentation (from https://github.com/mbostock/d3/wiki/Force-Layout#size):

When nodes are added to the force layout, if they do not have x and y attributes already set, then these attributes are initialized using a uniform random distribution in the range [0, x] and [0, y], respectively.

So just adding x and y properties to each of your data objects should be enough to cause the position to be the same each time.