Compare function in treelayout


I am trying to define custom compare function in treeLayout. here is the sample code, i am using:

var treeLayout = new go.TreeLayout();
<span =“Apple-tab-span” style=“white-space:pre”> treeLayout.angle = 90;
<span =“Apple-tab-span” style=“white-space:pre”> treeLayout.comparer = treeNodeComparer;
<span =“Apple-tab-span” style=“white-space:pre”> treeLayout.sorting = go.TreeLayout.SortingAscending;
<span =“Apple-tab-span” style=“white-space:pre”> treeLayout.path = go.TreeLayout.PathSource;

function treeNodeComparer(first,second)
<span =“Apple-tab-span” style=“white-space:pre”> {
<span =“Apple-tab-span” style=“white-space:pre”> var firstNode=;
<span =“Apple-tab-span” style=“white-space:pre”> var;
<span =“Apple-tab-span” style=“white-space:pre”>
<span =“Apple-tab-span” style=“white-space:pre”> if (first.topNode)
<span =“Apple-tab-span” style=“white-space:pre”> return 1;
<span =“Apple-tab-span” style=“white-space:pre”> if (second.topNode)
<span =“Apple-tab-span” style=“white-space:pre”> return -1;
<span =“Apple-tab-span” style=“white-space:pre”> return 0;
<span =“Apple-tab-span” style=“white-space:pre”> }

The issue i am facing is that if i set treeLayout.path to something beside TreeLayout.PathSource, the custom comparer function will not used to re-sorting. Even with TreeLayout.PathSource it only compare partial nodes instead of All.

Basically what i want to do here is: to set particular node on top all the time and particular node on the bottom of tree. and all other nodes are following by some logic.


The TreeLayout.sorting and .comparer properties govern the order of the (multiple) children of a parent vertex. It is not used to determine what “layer” the vertex/node should be in.

Root nodes/vertexes are automatically determined to be those that have no links/edges coming in. Or if Diagram.isTreePathToChildren is false or if TreeLayout.path is TreeLayout.PathSource, those with no links/edges going out.

thanks for the information. Is there a work around to do that right now? or is there a plan to add such feature in next version?


I don’t know what you are looking to do. Are you trying to put the root node in some level/layer other than the first one? If so, I don’t know how well the TreeLayout will work.

If you are trying to put leaf nodes/vertexes, or whole subtrees, at levels/layers that are deeper in the tree than they would normally be, I think that could be done. In fact, that is exactly what the Parse Tree sample does:

what I am trying to do here is to specify a node to be root of tree no matter where it original position is. for example, I have a tree with nodes a, b, c, d, e and with link looks like:

<span =“Apple-tab-span” style=“white-space:pre”> {“from”:a,“to”:b},
<span =“Apple-tab-span” style=“white-space:pre”> {“from”:a,“to”:c},
<span =“Apple-tab-span” style=“white-space:pre”> {“from”:c,“to”:d},
<span =“Apple-tab-span” style=“white-space:pre”> {“from”:b,“to”:e},<span =“Apple-tab-span” style=“line-height: 1.4; white-space: pre;”>

With above data, A will be root and shows on top of tree. but i want to do here is to show b on top of all.

I will take a look on parseTree.

Well, you could reverse the TreeEdge that runs from “a” to “b”. I think that would give you the effect that you want (i.e. “b” on top) without messing up the laid-out positions of any other nodes. And doing so in an override of TreeLayout.makeNetwork means that you would not actually be modifying or replacing any Links in the Diagram.