TreeLayout StyleRootOnly root nodes overlapping

@Valerii wrote:

Hello! Cant find a solution.
We have a diagram with TreeLayout, and it must looks like this:

3.jpg2482×538 92.8 KB

Setup is:

    this.contentAlignment = go.Spot.TopLeft; // Diagram align center
    this.toolManager.draggingTool.isEnabled = false; // Disable node moving
    this.toolManager.panningTool.isEnabled = true; // Diagram moving
    this.allowMove = false; // Disable node moving
    this.model = new go.TreeModel([]); // Define diagram model
    this.defaultCursor = 'pointer'; // Define diagram cursor
    this.nodeTemplateMap = templateMap;
    this.padding = new go.Margin(0);

    this.layout = $(
        go.TreeLayout,
        {
            treeStyle: go.TreeLayout.StyleRootOnly,
            angle: 90,
            layerSpacing: 20,
            compaction: go.TreeLayout.CompactionNone,
            alternateAlignment: go.TreeLayout.AlignmentStart,
            alternateNodeIndent: 50,
            alternateNodeIndentPastParent: 0.4,
            alternateLayerSpacingParentOverlap: 1,
            alternatePortSpot: new go.Spot(0.01, 1, 16, 0),
            alternateCompaction: go.TreeLayout.CompactionNone
        }
    );

 // Connection Arrows of Nodes
    this.linkTemplate = $(
        go.Link,
        go.Link.Orthogonal,
        {
            corner: 0,
            selectable: false
        },
        $(
            go.Shape,
            {
                strokeWidth: 1
            },
            new go.Binding('stroke', 'fromNode', n => n.data.parent ? Diagram.Color.Grey : null).ofObject()
        )
    );

And there is one issue with Top folders (root nodes) overlapping only if it is expanded, and all direct child (collapsed, or without children) template width is less than Top folder parent width.

2.jpg769×282 20.3 KB

1.jpg833×389 27 KB

It seems like overall branch with calculating depending on child width.
Trying to fix this 2nd day in a row .(
Thank you!

Posts: 4

Participants: 2

Read full topic