Parse Tree Diagram With Leaf Nodes in Horizontal Line
A parse tree is an ordered, rooted tree representing the structure of a sentence, broken down to parts-of-speech.
This diagram uses a custom TreeLayout called FlatTreeLayout that places all leaf nodes at the same Y position. It also makes use of a TreeExpanderButton on the node template. See the learn page on buttons for more GoJS button information.
The abbreviations used in this diagram are:
- NP, a noun phrase
- VP, a verb phrase
- PP, a prepositional phrase
- DT, a determiner
- JJ, an adjective
- NN, a common noun
- VBZ, a third person singular present verb
- VBN, a past participle verb
GoJS Features in this sample
Tree Layout
This predefined layout is used for placing Nodes of a tree-structured graph in layers (rows or columns). For discussion and examples of the most commonly used properties of the TreeLayout, see the learn Trees page. More information can be found in the GoJS learn pages.
Custom Layouts
GoJS allows for the creation of custom layouts to meet specific needs.
There are also many layouts that are extensions -- not predefined in the
go.js or go-debug.js library, but available as source code in
one of the three extension directories, with some documentation and corresponding
samples. More information can be found in the
GoJS learn pages.
Buttons
GoJS defines several Panels for common uses. These include "Button", "TreeExpanderButton", "SubGraphExpanderButton", "PanelExpanderButton", "ContextMenuButton", and "CheckBoxButton". "ContextMenuButton"s are typically used inside of "ContextMenu" Panels; "CheckBoxButton"s are used in the implementation of "CheckBox" Panels.
These predefined panels can be used as if they were Panel-derived classes in calls to GraphObject.build. They are implemented as simple visual trees of GraphObjects in Panels, with pre-set properties and event handlers.
More information can be found in the GoJS learn pages.