How to create two tree in same div(myDiagram)?

hi,i am a complete beginner about gojs.
i need to show two trees in one div,
one is in the left side,the other is in right side.
like the picture,one tree i know how to create.
how to create two trees?
need group?TreeLayout?

This sample shows multiple trees (a forest?): http://gojs.net/latest/samples/classHierarchy.html in the larger diagram.

Its Diagram.layout has TreeLayout.angle being 0 instead of 90. If you really want the trees to be next to each other horizontally, you will also need to set http://gojs.net/latest/api/symbols/TreeLayout.html#arrangement to go.TreeLayout.ArrangementHorizontal.

thank you very much,it works for me

and i have another question,i want to one tree‘s top position not same to the other tree‘s top position.
that means the two trees not on the same level.
like this

The follow-on question really is deserving of another forum topic.

Depending on the circumstances, which you did not describe, you could make such root nodes be artificially tall. You could do that either by designing the template so that the Node.actualBounds leaves a variable amount of room above the panel holding the visible elements, or by overriding TreeLayout.makeNetwork so that it made the TreeVertexes corresponding to those nodes to be taller than their TreeVertex.node’s actualBounds.

Yet a third alternative might be to move individual trees down or up after the layout is complete. You can do that either in a “LayoutCompleted” DiagramEvent or in an overridden TreeLayout.commitLayout.