This sample allows a user to make progressive decisions about personality types.
There are two kinds of nodes, so there are two node templates ("decision" and "personality") that determine the appearance and behavior of each Node.
The "decision" template displays the abbreviated personality type and two choice buttons, all surrounded by a figure. Clicking a button will either expand the choice or will collapse all nodes leading from that choice.
The "personality" template displays the personality descriptions, as the "leaf" nodes for the tree.
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.
A tooltip is an Adornment that is shown when the mouse hovers over an object that has its GraphObject.toolTip set. The tooltip part is bound to the same data as the part itself.
It is typical to implement a tooltip as a "ToolTip" Panel holding a TextBlock or a Panel of TextBlocks and other objects. Each "ToolTip" is just an "Auto" Panel Adornment that is shadowed, and where the border is a rectangular Shape with a light gray fill. However you can implement the tooltip as any arbitrarily complicated Adornment.
More information can be found in the GoJS Intro.
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.