I’m looking at the Double Tree example and I’m trying to understand the default behaviour of Part.LayoutId. If I look at the demo code there is a line that says:

this.LayoutId = “All”; // the root node participates in all layouts

Is it necessary to always ensure the ‘All’ is set as the default LayoutId when a layout is not explicitly set on a node? I’ve noticed in my own testing that when using multiple layouts it appears it is necessary to do so.

Secondly, is it possible to center the layout/view around a particular node? In the Double Tree example it appears the Diagram is centered around the ‘ROOT’ node. I’m trying to achieve a similar effect with a diagram I’m working on.


Part.LayoutId needs to be "All" for all root nodes.

TreeLayout.Arrangement needs to be "FixedRoots" -- this causes the root node(s) not to be moved, but all of their subtrees will be laid out relative to the root node.

Hi Walter

Thanks for the explanation. Can you give me any suggestions on how I can center the view around a particular node? Consider the Double Tree example. Currently, this will center the entire tree within the viewport. In my case I need a particular node to be centered in the viewport, regardless of how deep it’s left sub-tree or right sub-tree may be.


Centering the whole graph within the diagram’s viewport is controlled by the HorizontalContentAlignment and VerticalContentAlignment properties.

If you want to center a particular Node in the viewport, call Diagram.Panel.CenterPart. Of course if the Diagram.Panel.DiagramBounds is not large enough, it might not be possible to scroll the graph to get a node that is near the sides of the diagram bounds to be at the actual center of the viewport.


I’m trying to replicate the Double Tree example for my own purposes but I’m having a little bit of difficulty. There are two key differences between the Double Tree example and my diagram. My diagram uses a GraphLinksModel instead of a TreeModel and the left-sub tree of my “root” node are all the descendants of the “root” while the right-sub tree are all the ancestors of the “root”. I know that referring to the node as the “root” isn’t technically correct but I think you get the idea.

You might be thinking “why not use a single tree layout”? This is because I need the “root” to be laid out in the center of the diagram and the Double Tree is where I got the idea on how to do this.

The problem I’m having is attempting to plot this relationship. The left sub-tree plots fine but the right sub-tree doesn’t plot correctly. Below is picture of what I mean: (In this example the ‘Prepaid Expenses’ node is the “root”; the ‘Plant’ node is an ancestor of the “root” and all the other nodes are children of the root. Notice how the ‘Plant’ node is plotting to the left of the root)

However, if I treat the the ‘Plant’ node as a descendant of the root then it plots correctly:

I’m guessing this is because the layout sees ‘Plant’ as the root and plots accordingly, regardless of my attempts to try and fool it.

My only other option, I’m guessing, is to plot the entire the tree in a single tree layout and somehow center the view around the ‘Prepaid Expenses’ node?

Is there any way to prevent the animation that results when calling Diagram.Panel.CenterPart?

Yes, some of the layouts, and TreeLayout in particular, are sensitive to the directionality of links. In this case I think you want to set the TreeLayout.Path property.

To avoid scrolling/zooming animation, you need to set DiagramPanel.ZoomTime = 0. Here’s one way to do that:

myDiagram.TemplateApplied += (s, e) => { myDiagram.Panel.ZoomTime = 0; };
Also, in case you want to turn off layout animation:

myDiagram.TemplateApplied += (s, e) => { myDiagram.LayoutManager.Animated = false; };

I tried

<span style=“font-size:12.0pt;font-family:“Times New Roman”,“serif”; mso-fareast-font-family:Calibri;mso-fareast-theme-font:minor-latin;mso-ansi-: EN-ZA;mso-fareast-:EN-ZA;mso-bidi-:AR-SA”> myDiagram.TemplateApplied += (s, e) => { myDiagram.LayoutManager.Animated = false; };

but it had no effect. myDiagram.Panel.CenterPart() still results in an animation. I also tried myDiagram.CenteredNodeData instead. Setting myDiagram.Panel.ZoomTime = 0 worked though.