D3.js forced directed graph effects on input

Question

I use d3.js exactly as shown here , but with a different data value.

When the graph is shown first, all elements are scattered and quickly move to their position for about a second. This looks good in the example, but for my data it does not look so good. Any way to disable it so that the nodes start at the specified location? Any way to customize the visualization of the recording?

Answer 1

You can scroll through the array of nodes and set the .x / .y and .px / .py values ​​to the original position where you want the nodes to be, and thereby limit the amount they need to move to their original layout. If you turn off the directivity algorithm (the tick () function), you can apply the standard .transtion () behavior. Duration (500) .attr ("transform", xx) to nodes and links to make them animated in the way you prefer before or after running the algorithm with a forced orientation, but make sure you set the .x / .y and .px / .py to their final position, otherwise they will reset as soon as you .tick ()