LayeredDigraphLayout nodes rendering to wrong layer when layers contain no nodes

@mark-tnt wrote:

I have a diagram using a modified LayeredDigraphLayout. I need 5 layers to be displayed at all times, even when a layer does not contain any nodes.

This is the overridden assignLayers() function of the custom layout (there are no other modifications):

assignLayers = (): void => {
    const layout = this as DeviceEditWiringViewDiagramLayout;

    // call super for initial layer assignments
    DeviceEditWiringViewDiagramLayout.prototype.assignLayers.call(layout);

    // iterate through all the nodes
    layout.network.vertexes.each((v: go.LayeredDigraphVertex) => {
        // we need to check the node template to be "GeneralDevice", as only its data
        // model is the type of DeviceHeaderDiagramModel
        switch (v.node.category) {
            case "GeneralDevice":
                const model = v.node.data as DeviceHeaderDiagramModel;

                // nodes without input ports go to the left side
                if (model.ports.every(group => group.inputPorts.length === 0)) {
                    v.layer = 4;
                }

                // the only node with both input and output ports goes to the middle
                else if (model.ports.some(
                    group =>
                        group.inputPorts.length !== 0 &&
                        group.outputPorts.length !== 0
                )) {
                    v.layer = 2;
                }

                // nodes without output ports go to the right
                else if (model.ports.every(group => group.outputPorts.length === 0)) {
                    v.layer = 0;
                }

                break;

            case "GeneralDevicePlaceholder":
                const placeholderModel = v.node.data as DeviceHeaderPlaceholderDiagramModel;

                if (placeholderModel.inputPort) v.layer = 1;
                else if (placeholderModel.outputPort) v.layer = 3;

                break;

            default:
                break;
        }
    });
};

So I explicitly tell every node on the diagram which layer they should be in and this is working correctly. The issue is if one of the middle layers (second and fourth) is empty (does not contain any nodes), the outer layers (first and fifth) jump in their place (0->1 and 4-> 3).

This is how it looks like correctly with 5 layers:

image.png1510×629 22.4 KB

And this is how it looks when the middle layers (1 and 3) do not contain any nodes:

image.png1616×637 25.5 KB

Actually it starts from the left and layer 4 will stay in place. Layer 2 will jump in the place of 3, and 0 to 2.

Posts: 5

Participants: 2

Read full topic