Simulating Input using InputEvents
To simulate mouse events the buttons above use the emit... methods of the Diagram class.
The UndoManager has been enabled in the main Diagram. Give focus to the Diagram and you can undo everything and then redo everything to confirm what was executed by the simulated events.
The Robot extension class has been deprecated, because the functionality has been moved to the Diagram class. The extension remains here for compatibility, but we recommend that you use the "emit..." methods of Diagram, which are compatible with the functionality of the extension, except that their names start with "emit...".
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 learn pages.
Context Menus
A GoJS context menu is an Adornment that is shown when the user context-clicks (right mouse click or long touch hold) an object that has its GraphObject.contextMenu set. The context menu is bound to the same data as the part itself.
It is typical to implement a context menu as a "ContextMenu" Panel containing
"ContextMenuButton"s, as you can see in the code below in the assignment of the Node's
GraphObject.contextMenu
and
Diagram.contextMenu
properties. Each "ContextMenu" is just a "Vertical" Panel
Adornment that is shadowed.
Each "ContextMenuButton" is a Panel on which you can set the
GraphObject.click event
handler. In the event handler obj.part will be the whole context menu
Adornment. obj.part.adornedPart will be the adorned Node or Link. The bound
data is obj.part.data, which will be the same as
obj.part.adornedPart.data.
More information can be found in the GoJS learn pages.
Palette
A Palette is a subclass of Diagram that is used to display a number of Parts that can be dragged into the diagram that is being modified by the user. The initialization of a Palette is just like the initialization of any Diagram. Like Diagrams, you can have more than one Palette on the page at the same time.
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.
GoJS Extensions
GoJS can be extended in a variety of ways. The most common way to change the standard behavior is to set properties on the GraphObject, Diagram, CommandHandler, Tool, or Layout. But when the desired property does not exist, you might need to override methods of CommandHandler, Tool, Layout, Link, or Node. Methods that you can override are documented in the API reference. Various features of GoJS can be overriden, either by replacing a method on an instance (a feature of JavaScript) or by defining a subclass. You should not modify the prototypes of any of the GoJS classes.
In addition to our samples, GoJS provides an
extensions gallery, showcasing the creation of custom tools and layouts. Those classes and samples are
written in TypeScript, available at ../extensionsJSM/, as
ECMAScript/JavaScript modules -- these use the
../release/go-module.js library. We recommend that you copy the files that
you need into your project, so that you can adjust how they refer to the GoJS library
that you choose and so that you can include them into your own building and packaging
procedures.
More information can be found in the GoJS learn pages.
HTML Interaction
GoJS Diagrams can be used alongside other HTML elements in a webapp. For custom Text Editors, Context Menus, and ToolTips, which are invoked and hidden via GoJS tool operations, it is best to use the HTMLInfo class.
More information can be found in the GoJS learn pages.