Reordering force directed graph

I am currently creating an animation, and I’m struggling to re-organize my graph after I initially display it.

This is my initial layout :


And I need to get to this (each node connected to his next peer):


I tried many things, including updating links and updating display, but nothing works I only have things like that:

Any idea how to update the chart smoothly?

Is the problem just that you want to be able to lay out a graph in a spiral? Or do you need to figure out how to create the graph that is a long chain? Or something else?

For the former, you can use the SpiralLayout extension: Spiral Layout

Sorry, I am trying to dynamically transition from layout in picture 1 to picture 2 (spiral), all in the same chart and without having to remove / re-create the nodes

The 1st picture is the result of a sequence of several steps with nodes and links appearing during 10 seconds, and then it freeze at picture 1 point, and I then want to order them in spiral.

Instead of spiral it could also be to transition to grid-like system too.

ps: thanks so much for the quick reply, I’m new to gojs and this is really nice

Regarding changing the layout: Take a look at the implementation of this sample: Fishbone Layout. Look at what each of the buttons does to replace the diagram’s current layout.

But you will need to remove many (or all?) of the links, and then add new ones to form the long chain of nodes. To do that, after you start the transaction and before you replace the Diagram.layout, you can replace the GraphLinksModel.linkDataArray.