The ActionTool is responsible for handling and dispatching mouse events on GraphObjects
that have GraphObject#isActionable set to true.
This is how one implements "controls", such as buttons or sliders or knobs, as GraphObjects
that can be inside Parts without interfering with the standard tool behaviors.
AnimationManager handles animations in a Diagram. Each Diagram has one, Diagram#animationManager.
Setting the Model, performing a Layout, Group expansion and Tree expansion automatically start animations through
the #defaultAnimation. Animations can be manually started by creating Animations, which are associated with an
AnimationManager.
An AnimationTrigger describes how to automatically animate a property on a GraphObject
when it changes value.
The target property name is a string, and all name matching is case-sensitive.
A Binding describes how to automatically set a property on a GraphObject
to a value of a property of data in the model.
The target property name and the data source property name are strings.
All name matching is case-sensitive.
A Brush holds color information and describes how to draw the inside
of a Shape or the stroke of a shape or a TextBlock or the
background of any GraphObject.
A ChangedEvent represents a change to an object, typically a GraphObject,
but also for model data, a Model, or a Diagram.
The most common case is for remembering the name of a property
and the before-and-after values for that property.
This layout positions nodes in a circular arrangement.
There are several samples that use CircularLayout.
The layout cannot guarantee that it provides optimal positioning of nodes when trying to minimize link crossings.
This class represents an abstract graph of CircularVertexes and CircularEdges
that can be constructed based on the Nodes and Links of a Diagram
so that the CircularLayout can operate independently of the diagram until it
is time to commit any node positioning or link routing.
The ClickCreatingTool lets the user create a node by clicking where they want the new node to be.
By default a double-click is required to start this tool;
set #isDoubleClick to false if you want a single-click to create a node.
The ClickSelectingTool selects and deselects Parts when there is a click.
It does this by calling Tool#standardMouseSelect.
It is also responsible for handling and dispatching click events on GraphObjects
by calling Tool#standardMouseClick.
The Diagram#commandHandler implements various
commands such as CommandHandler#deleteSelection or CommandHandler#redo.
The CommandHandler includes keyboard event handling to interpret
key presses as commands.
A Diagram is associated with an HTML DIV element. Constructing a Diagram creates
an HTML Canvas element which it places inside of the given DIV element, in addition to several helper DIVs.
GoJS will manage the contents of this DIV -- you should not modify the contents of the DIV,
although you may style the given DIV (background, border, etc) and position and size it as needed.
A DiagramEvent represents a more abstract event than an InputEvent.
They are raised on the Diagram class.
One can receive such events by registering a DiagramEvent listener on a Diagram
by calling Diagram#addDiagramListener.
The listener function, when called, will be passed an instance of a DiagramEvent.
Use the #name property to decide what kind of diagram event it is.
The #diagram property refers to the Diagram, and you can get additional information
from that, such as the Diagram#lastInput, which in turn provides information
such as InputEvent#documentPoint that may be relevant for that kind of DiagramEvent.
This is used in dragging methods to remember initial locations, for relative positioning and for cancellation.
You do not typically need to create these unless you are overriding tools.
The DraggingTool is used to move or copy selected parts with the mouse.
This sets the Part#location property; you may want to save the location to the model
by using a TwoWay Binding on the "location" property in your Parts/Nodes/Groups templates.
The DragSelectingTool lets the user select multiple parts within a rectangular area drawn by the user.
There is a temporary part, the #box,
that shows the current area encompassed between the mouse-down
point and the current mouse point.
The default drag selection box is a magenta rectangle.
You can change the #box to customize its appearance -- see its documentation for an example.
Force-directed layout treats the graph as if it were a system of physical bodies
with repulsive electrical, attractional gravitational, and spring forces acting on them and between them.
This class represents an abstract graph of ForceDirectedVertexes and ForceDirectedEdges
that can be constructed based on the Nodes and Links of a Diagram
so that the ForceDirectedLayout can operate independently of the diagram until it
is time to commit any node positioning or link routing.
The Geometry class is used to define the "shape" of a Shape.
A Geometry can be simple straight lines, rectangles, or ellipses.
A Geometry can also be an arbitrarily complex path, consisting of a list of PathFigures.
GraphLinksModels support links between nodes and grouping nodes and links into subgraphs.
GraphLinksModels hold node data and link data in separate arrays.
Node data is normally represented in a Diagram by instances of Node,
but they could be represented by simple Parts or by Groups.
Link data should be represented by instances of Link.
This is the abstract base class for all graphical objects.
Classes inheriting from GraphObject include:
Shape, TextBlock, Picture, and Panel.
From the Panel class the Part class is derived, from which the
Node and Link classes derive.
This simple layout places all of the Parts in a grid-like arrangement, ordered, spaced apart,
and wrapping as needed. It ignores any Links connecting the Nodes being laid out.
There are many samples that use GridLayout.
Every Palette uses a GridLayout by default.
(undocumented)
Iterating over Maps is very similar to an Iterator<KeyValuePair<K, V>>,
but not exactly, because the type of the value property is V, not KeyValuePair<K, V>.
An InputEvent represents a mouse or keyboard or touch event.
The principal properties hold information about a particular input event.
These properties include the #documentPoint at which a mouse event
occurred in document coordinates,
the corresponding point in view/element coordinates, #viewPoint,
the #key for keyboard events,
and the #modifiers and #button at the time.
Additional descriptive properties include #clickCount, #delta,
#timestamp, and the source event #event (if available).
This interface defines properties and methods for iterating over a collection;
it provides the #next predicate and the #value read-only property.
Some Iterators also provide key property values along with each value.
Layers are how named collections of Parts are drawn in front or behind other collections of Parts in a Diagram.
Layers can only contain Parts, such as Nodes and Links. They cannot hold GraphObjects directly.
This class represents an abstract graph of LayeredDigraphVertexes and LayeredDigraphEdges
that can be constructed based on the Nodes and Links of a Diagram
so that the LayeredDigraphLayout can operate independently of the diagram until it
is time to commit any node positioning or link routing.
This is the base class for all of the predefined diagram layout implementations.
They only arrange Parts (primarily Nodes and Links) in a Diagram,
not to GraphObjects in Panels (i.e. panel layout).
An edge represents a Link in a LayoutNetwork,
along with its #fromVertex and #toVertex.
The #link property may be null for edges that represent "dummy" links,
when the layout wants to work with a network that is not isomorphic with the collection of Nodes and Links being laid out.
This provides an abstract view of a diagram as a
network (graph) of vertexes and directed edges.
The network contains vertexes and edges corresponding to Nodes and Links.
A vertex represents a Node in a LayoutNetwork,
along with its #bounds and #focus and collections of LayoutEdges that come into and go out of the vertex.
The #node property may be null for vertexes that represent "dummy" nodes,
when the layout wants to work with a network that is not isomorphic with the collection of Nodes and Links being laid out.
A Link is a Part that connects Nodes.
The link relationship is directional, going from Link#fromNode to Link#toNode.
A link can connect to a specific port element in a node, as named by the Link#fromPortId
and Link#toPortId properties.
The LinkReshapingTool is used to interactively change the route of a Link
by setting its Link#points list.
You may want to save the route to the model by using a TwoWay Binding on the "points" property of the Link.
Models hold the essential data of a diagram, describing the basic entities and their properties and relationships
without specifying the appearance and behavior of the Nodes and Links and Groups that represent them visually.
Models tend to hold only relatively simple data, making them easy to persist by serialization as JSON or XML formatted text.
Palette extends the Diagram class to allow objects to be dragged and placed onto other Diagrams.
Its Diagram#layout is a GridLayout.
The Palette is Diagram#isReadOnly but to support drag-and-drop its Diagram#allowDragOut is true.
A Panel is a GraphObject that holds other GraphObjects as its elements.
A Panel is responsible for sizing and positioning its elements.
The elements of a panel are drawn in the order in which they appear in the #elements collection.
This is the abstract base class for all Panel Layouts, which inform the possible Panel types.
It is possible to create your own Panel type by creating a subclass of PanelLayout,
though this is not common and not recommended for beginners.
This is the base class for all user-manipulated top-level objects.
Because it inherits from Panel, it is automatically a visual container
of other GraphObjects.
Because it thus also inherits from GraphObject, it also has properties such as
GraphObject#actualBounds, GraphObject#contextMenu, and GraphObject#visible.
A PathSegment represents a straight line or curved segment of a path between
two or more points that are part of a PathFigure.
The very first point is given by the PathFigure#startX and PathFigure#startY properties.
After the first segment the beginning point of the next segment is the same as the end point of the previous segment.
For most types of PathSegments the end point of the segment is given by #endX and #endY.
If a Placeholder is in the visual tree of a Group, it represents the area of all of the member Parts of that Group.
If a Placeholder is in the visual tree of an Adornment, it represents the area of the Adornment#adornedObject.
Unlike other GraphObjects, the Placeholder measures itself based on these criteria, and not on its own #desiredSize or #scale.
It will set its own natural bounds and scale, and in the case of Groups will set the Group's location.
The ResizingTool is used to interactively change the size of a GraphObject
in the selected Part or Node by setting its GraphObject#desiredSize property.
You may want to save the size to the model by using a TwoWay Binding on the "desiredSize" property
of the GraphObject that is named by Part#resizeObjectName.
This tool does not operate on Links.
The RotatingTool is used to interactively change the GraphObject#angle of a GraphObject
by setting its GraphObject#angle property.
You may want to save the angle to the model by using a TwoWay Binding on the "angle" property
of the GraphObject that is named by Part#rotateObjectName.
The RowColumnDefinition class describes constraints on a row or a column
in a Panel of type Panel.Table.
It also provides information about the actual layout after the
Table Panel has been arranged.
A Shape is a GraphObject that shows a geometric figure.
The Geometry determines what is drawn;
the properties #fill and #stroke
(and other stroke properties) determine how it is drawn.
The TextEditingTool is used to let the user interactively edit text in place.
This sets the TextBlock#text property; you may want to save the changed text to the model
by using a TwoWay Binding on the "text" property of editable TextBlocks.
Tools handle mouse, keyboard, and touch events.
The currently running tool, Diagram#currentTool, receives all input events from the Diagram
via canonicalized InputEvents.
TreeModels support tree-structured graphs of nodes and links.
Each node can have at most one "tree parent"; cycles are not permitted.
The reference to the parent node's key is a property of the child node data.
This class represents an abstract graph of TreeVertexes and TreeEdges
that can be constructed based on the Nodes and Links of a Diagram
so that the TreeLayout can operate independently of the diagram until it
is time to commit any node positioning or link routing.
An UndoManager observes and records model and diagram changes in transactions and
supports undo/redo operations.
You will need to set the #isEnabled property to true in order for
the UndoManager to record changes and for users to perform an undo or a redo.