d/gojs library

GoJS official website: https://gojs.net/latest/index.html

Example:

import 'package:typings/d/gojs.dart' as go;


void main() {
    // inserts the GoJS js file into the DOM
    await go.import(); 

    // from here you can use the go library, ie:
    final goDiagram = go.Diagram.$2(diagram)
      ..addDiagramListener(go.DiagramEventNameOptions.linkDrawn, showLinkLabel)
      ..addDiagramListener(
          go.DiagramEventNameOptions.linkRelinked, showLinkLabel);
}

Classes

$ModuleGo
ActionTool: 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.
Adornment: An Adornment is a special kind of Part that is associated with another Part, the Adornment#adornedPart.
Animation: Animations are used to animate GraphObject and Diagram properties.
AnimationManager: 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.
AnimationTrigger: 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.
Binding: 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.
Brush: 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.
ChangedEvent: 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.
CircularEdge: This holds CircularLayout-specific information about Links.
CircularLayout: 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.
CircularNetwork: 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.
CircularVertex: This holds CircularLayout-specific information about Nodes.
ClickCreatingTool: 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.
ClickSelectingTool: 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.
CommandHandler: 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.
ContextMenuTool: The ContextMenuTool is used to create and show a context menu. It automatically disables any browser context menu.
CreateLinearGradient
CreateRadialGradient
Diagram: 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.
DiagramEvent: 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.
DiagramEventsInterface: A TypeScript type for helping to declare GraphObject.make.
DiagramRendererOptions: Used for the options arguments to Diagram.makeImage, Diagram.makeImageData, and Diagram.makeSvg.
DraggingInfo: 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.
DraggingOptions: New in 2.0, this class contains options for dragging and moving parts.
DraggingTool: 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.
DragSelectingTool: 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.
EnumValue: (undocumented)
ForceDirectedEdge: This holds ForceDirectedLayout-specific information about Links.
ForceDirectedLayout: 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.
ForceDirectedNetwork: 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.
ForceDirectedVertex: This holds ForceDirectedLayout-specific information about Nodes.
Geometry: 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.
GraphLinksModel: 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.
GraphObject: 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.
GridLayout: 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.
Group: A Group is a Node that can contain a subgraph of Nodes and Links, which are members of the group.
HTMLInfo: HTMLInfo is used to show and hide custom HTML page elements, such as a context menu, tooltip, or text editor made of HTML.
IContext: (undocumented) interface used for both the SVGContext and the CanvasSurfaceContext, which are undocumented classes.
IInline0
IInline1
IInline11
IInline12
IInline13
IInline2
ImageRendererOptions: Used for the options argument to Diagram.makeImage and Diagram.makeImageData.
IMapIterator<K, T>: (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>.
IncrementalData: Interface for the output object of Model#toIncrementalData.
InputEvent: 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).
ISurface: (undocumented) interface used for both the SVGSurface and the CanvasSurface, which are undocumented classes.
Iterable<T>: This interface is implemented by the List, Set, and Map classes; it provides the #iterator read-only property that returns an Iterator.
Iterator<T>: 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.
KeyValuePair<K, V>: (undocumented)
Layer: 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.
LayeredDigraphEdge: This holds LayeredDigraphLayout-specific information about Links.
LayeredDigraphLayout: This arranges nodes of directed graphs into layers (rows or columns). There are many samples that use LayeredDigraphLayout.
LayeredDigraphNetwork: 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.
LayeredDigraphVertex: This holds LayeredDigraphLayout-specific information about Nodes.
Layout: 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).
LayoutEdge: 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.
LayoutNetwork: 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.
LayoutVertex: 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.
Link: 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.
LinkingBaseTool: This abstract class is the base class for the LinkingTool and RelinkingTool classes.
LinkingTool: The LinkingTool lets a user draw a new Link between two ports, using a mouse-drag operation.
LinkReshapingTool: 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.
List<T>: NOTE: For 2.0 the #constructor argument has changed. List now optionally accepts a collection, and only checks types in TypeScript.
Map<K, V>: NOTE: For 2.0 the #constructor arguments have changed. Map now optionally accepts a collection, and only checks types in TypeScript.
Margin: A Margin represents a band of space outside or inside a rectangular area, with possibly different values on each of the four sides.
Model: 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.
Node: A Node is a Part that may connect to other nodes with Links, or that may be a member of a Group.
Overview: An Overview is a Diagram that displays all of a different diagram, with a rectangular box showing the viewport displayed by that other diagram.
Palette: 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.
Panel: 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.
PanelLayout: 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.
PanningTool: The PanningTool supports manual panning, where the user can shift the Diagram#position by dragging the mouse.
Part: 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.
PathFigure: A PathFigure represents a section of a Geometry. It is a single connected series of two-dimensional geometric PathSegments.
PathSegment: 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.
Picture: A Picture is a GraphObject that shows an image, video-frame, or Canvas element.
Placeholder: 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.
Point: A Point represents an x- and y-coordinate pair in two-dimensional space.
Rect: A Rect describes a rectangular two-dimensional area as a top-left point (x and y values) and a size (width and height values).
RelinkingTool: The RelinkingTool allows the user to reconnect an existing Link if the Link#relinkableTo and/or Link#relinkableFrom properties are true.
ResizingTool: 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.
RotatingTool: 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.
RowColumnDefinition: 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.
Set<T>: NOTE: For 2.0 the #constructor argument has changed. Set now optionally accepts a collection, and only checks types in TypeScript.
SGradient
Shape: 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.
Size: A Size describes a width and a height in two-dimensional coordinates. The width and height must both be non-negative.
Spot: A Spot represents a relative point from (0,0) to (1,1) within the bounds of a rectangular area plus an absolute offset.
SvgRendererOptions: Used for the options argument to Diagram.makeSvg.
TextBlock: A TextBlock is a GraphObject that displays a #text string in a given #font.
TextEditingTool: 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.
Tool: Tools handle mouse, keyboard, and touch events. The currently running tool, Diagram#currentTool, receives all input events from the Diagram via canonicalized InputEvents.
ToolManager: This special Tool is responsible for managing all of the Diagram's mode-less tools, which you can access as the Diagram#toolManager.
Transaction: A Transaction holds a list of ChangedEvents collected during a transaction, as the value of the read-only #changes property.
TreeEdge: This holds TreeLayout-specific information about Links.
TreeLayout: This layout positions nodes of a tree-structured graph in layers (rows or columns).
TreeModel: 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.
TreeNetwork: 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.
TreeVertex: This holds TreeLayout-specific information about Nodes.
UndoManager: 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.
UnionCommon4
UnionCommon5

Enums

DiagramEventNameOptions
DiagramInitStrings<T$>
Make
MakeOptions
Renderer
Scroll
ScrollOptions
StrokeCap
StrokeJoin
TextAlign

Extensions

ActionTool$Typings on ActionTool
Adornment$Typings on Adornment
Animation$Typings on Animation
AnimationManager$Typings on AnimationManager
AnimationTrigger$Typings on AnimationTrigger
Binding$Typings on Binding
Brush$Typings on Brush
ChangedEvent$Typings on ChangedEvent
CircularLayout$Typings on CircularLayout
CircularVertex$Typings on CircularVertex
ClickCreatingTool$Typings on ClickCreatingTool
ClickSelectingTool$Typings on ClickSelectingTool
CommandHandler$Typings on CommandHandler
ContextMenuTool$Typings on ContextMenuTool
Diagram$Typings on Diagram
DiagramEvent$Typings on DiagramEvent
DiagramEventsInterface$Typings on DiagramEventsInterface
DiagramRendererOptions$Typings on DiagramRendererOptions
DraggingInfo$Typings on DraggingInfo
DraggingOptions$Typings on DraggingOptions
DraggingTool$Typings on DraggingTool
DragSelectingTool$Typings on DragSelectingTool
EnumValue$Typings on EnumValue
ForceDirectedEdge$Typings on ForceDirectedEdge
ForceDirectedLayout$Typings on ForceDirectedLayout
ForceDirectedVertex$Typings on ForceDirectedVertex
Geometry$Typings on Geometry
GraphLinksModel$Typings on GraphLinksModel
GraphObject$Typings on GraphObject
GridLayout$Typings on GridLayout
Group$Typings on Group
HTMLInfo$Typings on HTMLInfo
IContext$Typings on IContext
IInline0$Typings on IInline0
IInline1$Typings on IInline1
IInline11$Typings on IInline11
IInline12$Typings on IInline12
IInline13$Typings on IInline13
IInline2$Typings on IInline2
ImageRendererOptions$Typings on ImageRendererOptions
IMapIterator$Typings on IMapIterator<K, T>
IncrementalData$Typings on IncrementalData
InputEvent$Typings on InputEvent
ISurface$Typings on ISurface
Iterable$Typings on Iterable<T>
Iterator$Typings on Iterator<T>
KeyValuePair$Typings on KeyValuePair<K, V>
Layer$Typings on Layer
LayeredDigraphEdge$Typings on LayeredDigraphEdge
LayeredDigraphLayout$Typings on LayeredDigraphLayout
LayeredDigraphVertex$Typings on LayeredDigraphVertex
Layout$Typings on Layout
LayoutEdge$Typings on LayoutEdge
LayoutNetwork$Typings on LayoutNetwork
LayoutVertex$Typings on LayoutVertex
Link$Typings on Link
LinkingBaseTool$Typings on LinkingBaseTool
LinkingTool$Typings on LinkingTool
LinkReshapingTool$Typings on LinkReshapingTool
List$Typings on List<T>
Map$Typings on Map<K, V>
Margin$Typings on Margin
Model$Typings on Model
Node$Typings on Node
Overview$Typings on Overview
Panel$Typings on Panel
PanelLayout$Typings on PanelLayout
PanningTool$Typings on PanningTool
Part$Typings on Part
PathFigure$Typings on PathFigure
PathSegment$Typings on PathSegment
Picture$Typings on Picture
Placeholder$Typings on Placeholder
Point$Typings on Point
Rect$Typings on Rect
RelinkingTool$Typings on RelinkingTool
ResizingTool$Typings on ResizingTool
RotatingTool$Typings on RotatingTool
RowColumnDefinition$Typings on RowColumnDefinition
Set$Typings on Set<T>
Shape$Typings on Shape
Size$Typings on Size
Spot$Typings on Spot
SvgRendererOptions$Typings on SvgRendererOptions
TextBlock$Typings on TextBlock
TextEditingTool$Typings on TextEditingTool
Tool$Typings on Tool
ToolManager$Typings on ToolManager
Transaction$Typings on Transaction
TreeEdge$Typings on TreeEdge
TreeLayout$Typings on TreeLayout
TreeModel$Typings on TreeModel
TreeVertex$Typings on TreeVertex
UndoManager$Typings on UndoManager

Constants

dist → const String

Functions

import() → FutureOr<bool>

Typedefs

BackConversion = dynamic Function(Model, [dynamic, dynamic])?
BrushLike = dynamic
ChangedEventHandler = void Function(ChangedEvent)
ConstructorType<T extends dynamic Function([Iterable?])> = dynamic Function([Iterable?])
DiagramEventHandler = void Function(DiagramEvent)
DiagramEventName = DiagramEventNameOptions
DiagramEvents = dynamic
DiagramInitOptions = dynamic
EasingFunction = num Function(num, num, num, num)
Key = dynamic
MakeAllow<CT extends ConstructorType<CT>, C, E> = dynamic
MarginLike = Object
TargetConversion = dynamic Function([dynamic, dynamic])?

d/gojs library

Example:

Classes

Enums

Extensions

Constants

Functions

Typedefs

typings package

typings.gojs library