This sample demonstrates a custom Layout, ArrangingLayout, that provides layouts of layouts. It assumes the graph should be split up and laid out by potentially three separate Layouts.

The first step of ArrangingLayout is that all unconnected nodes are separated out to be laid out later by the ArrangingLayout.sideLayout, which by default is a GridLayout.

The remaining nodes and links are partitioned into separate subnetworks (also known as subgraphs) with no links between subnetworks. The ArrangingLayout.primaryLayout is performed on each subnetwork.

If there is more than one subnetwork, those subnetworks are treated as if they were individual nodes and are laid out by the ArrangingLayout.arrangingLayout.

Finally the unconnected nodes are laid out by ArrangingLayout.sideLayout and they are all positioned at the ArrangingLayout.side Spot relative to the main body of nodes and links.

This extension layout is defined in its own file, as ArrangingLayout.ts.