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 Intro 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 Trees page in the Introduction. More information can be found in the GoJS Intro.

Related samples


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 Intro.

Related samples


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.make. 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 Intro.

Related samples