This uses a GraphLinksModel and a virtualized ForceDirectedLayout.
Node data in Model: . Actual Nodes in Diagram: .Link data in model: . Actual Links in Diagram: .
See also Virtualized.
GoJS Features in this sample
Collections
GoJS provides its own collection classes: List, Set, and Map. You can iterate over a collection by using an Iterator. More information can be found in the GoJS Intro.
Force Directed Layout
This predefined layout treats the graph as if it were a system of physical bodies with forces acting on and between them. The layout iteratively moves nodes and links to minimize the total sum of forces on each node. The resulting layout will normally not contain overlapping Nodes, excluding cases where the graph is densely interconnected. More information can be found in the GoJS Intro.
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.
ToolTips
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.