draw.io – Fix Tree Diagrams Not Behaving as Tree Diagrams

draw.io

Yes, I am answering my own question!

In draw.io, I discovered it is now possible to draw tree diagramas, either with horizontal or vertical layouts. Even though they seem made out of basic shapes and connectors, new tree-specific menus were now available when such entities are selected. Those menu options help in editing the tree by selecting or addind parents, siblings or infants instead of manually adding and connecting shapes.

With those menus, I created a new horizontal tree yesterday. Today when I opened it, I wanted to add new siblings and sub-tree but I realied all the tree editing options were gone. The diagram only behaved like normal shapes connected together. For reference, the first illustration shows a new horizontal tree dragged from the drawer correctly handled as a tree.

Expected output (entities are detected as forming a horizontal tree, notice the menu options):
Horizontal tree with options

What I found today with my diagram (notice the lack of options):
Horizontal tree-diagram not recognized as such

Question:

What enables draw.io to distinguish between a bunch of shapes and a tree layout? Is it possible to convert a set of shapes appropriatly connected into a tree layout?

Best Answer

This now works without the plugin, but you must use one of the special tree layout containers under Shapes > Advanced. Look for "Tree Container", "Horizontal Tree Layout", "Mindmap". I've highlighted them in the screenshot below.

Tree layout containers highlighted in the Shapes > Advanced panel

To port your existing trees simply paste them into one of the tree layout containers.

I came across your question while looking for help myself. The blog post about trees was updated in May to say that the plugin is no longer needed and trees can be added using shapes under Advanced. I tried the obvious ones (e.g. "Central Idea", "Branch") which didn't work as expected. Eventually I stumbled on this post which clued me in to the special containers.

Hope this helps!