Maintaining order of nodes when displayed as a linked list

Hi,
I have this kind of graph, and i want to maintain the order of the nodes with indices that can be changed by the user.
What is the best way to keep track of the order, and make gojs change them also visually, when changing the index or adding new node.

thanks.

Are you using a TreeLayout that has set its sorting and comparer properties?

When you add or remove a node, do you update all of the node data objects by setting a property on them with their order, so that a Binding on a TextBlock can show the order and so that the TreeLayout.comparer can compare based on that property value?

I do update when adding or removing nodes, by a property on each node with Binding.
But for the rest of you explanation, can you refer me to a sample that does so? or something similar? Thank you

Here you go: https://gojs.net/extras/sequencedTreeChildren.html

The custom SequencingTreeLayout automatically creates unmodeled (and thus unbound) Links between adjacent siblings. You will have to adapt the “template” Link that is named seqLink and the code in SequencingTreeLayout.makeSequencingLink to get the desired appearance for those special links.

You could add an editable TextBlock to the node template that has a TwoWay Binding to some property on the node data, and change the comparer function to use that property value instead of the key. I guess then you’d want to implement a “TextEdited” DiagramEvent listener that invalidated the Diagram.layout, so that the layout would be performed again, possibly re-ordering the children.

Thank you,
How can I see the code of this sample?

As with most all of our samples, all of the code is right there on the page.

I’m sorry, but this is what i’m getting in the link

Either download the page or execute the “View Page Source” command of the browser or look at it in the debugger.

1 Like