GoJS API
/ to search
    Preparing search index...

    Class LinkingTool

    The LinkingTool lets a user draw a new Link between two ports, using a mouse-drag operation.

    By default an instance of this tool is installed as a mouse-move tool in the Diagram.toolManager as the ToolManager.linkingTool. However this tool may be used modally, as described below.

    canStart calls findLinkablePort to find a valid "port" element from which (or to which) the user may interactively draw a new link. doActivate sets up a temporary link and two temporary nodes, one at the start port and one following the mouse.

    For a general discussion of validation, see Learn page on Validation.

    This tool does not utilize any Adornments or tool handles.

    This tool conducts a transaction while the tool is active. A successful linking will result in a "LinkDrawn" DiagramEvent and a "Linking" transaction.

    If you want to programmatically start a new user mouse-gesture to draw a new link from a given GraphObject that either is a "port" or may be within the visual tree of a "port", set the startObject property to let findLinkablePort find the real "port" element. Then start and activate this tool:

      const tool = myDiagram.toolManager.linkingTool;
    tool.startObject = ...;
    myDiagram.currentTool = tool;
    tool.doActivate();

    Hierarchy (View Summary)

    Index

    Constructors

    Accessors

    • get diagram(): Diagram

      This read-only property returns the Diagram that owns this tool and for which this tool is handling input events.

      Returns Diagram

    • get isActive(): boolean

      Gets or sets whether this tool is started and is actively doing something.

      You can set this to true after your tool is started (i.e. when it is the Diagram.currentTool and doStart had been called), but when it is not yet in a state that it is actually "doing" something, because it is waiting for the right circumstances. This is typically only important when the tool is used in a modal fashion.

      The default value is false. This is normally set by doActivate and doDeactivate.

      Returns boolean

    • get isEnabled(): boolean

      Gets or sets whether this tool can be started by a mouse event.

      Set this to false to prevent canStart from returning true. Setting this property to false should prevent this tool from being used in a mode-less fashion by the ToolManager with a mouse down/move/up event. However, even when this property is false, this tool can still be used in a modal fashion: it can still be started by explicitly setting the Diagram.currentTool property to this tool.

      The default value is true.

      Returns boolean

    • get isForwards(): boolean

      Gets whether the linking operation is in the forwards direction, connecting from the "From" port to the "To" port.

      Returns boolean

    • get isUnconnectedLinkValid(): boolean

      Gets or sets whether it is valid to have partly or completely unconnected links.

      The default value is false -- the user cannot draw or reconnect a link to "nowhere". Setting this property does not raise any events.

      Returns boolean

    • get linkingCursor(): string

      Gets or sets the cursor used during the linking or relinking operation. This defaults to 'pointer'. Read more about cursors at Diagram.currentCursor

      Returns string

      since

      2.2

    • get linkValidation(): | (
          (
              fromNode: Node | null,
              fromPort: GraphObject | null,
              toNode: Node | null,
              toPort: GraphObject | null,
              link: Link | null,
          ) => boolean
      )
      | null

      Gets or sets a predicate that determines whether or not a new link between two ports would be valid. This predicate is called in addition to the normal link checking performed by isValidLink and any Node.linkValidation predicates on the "from" and "to" nodes. When relinking, the Link being considered for reconnection is passed as the fifth argument. The default predicate is null, which is equivalent to simply returning true.

      For a more general discussion of validation, see Learn page on Validation.

      The function, if supplied, must not have any side-effects.

      Returns
          | (
              (
                  fromNode: Node | null,
                  fromPort: GraphObject | null,
                  toNode: Node | null,
                  toPort: GraphObject | null,
                  link: Link | null,
              ) => boolean
          )
          | null

    • get name(): string

      Gets or sets the name of this tool. The default name is an empty string, but the constructor for each instance of a subclass of Tool will initialize it appropriately. For example, the name of the DragSelectingTool is "DragSelecting".

      This name is sometimes used by tools that use Adornments as the Part.category for their Adornments. It is also sometimes used by tools that conduct transactions as the transaction name.

      Returns string

    • get originalFromNode(): Node | null

      Gets or sets the original Node from which the new link is being drawn or from which the originalLink was connected when being relinked. Setting this property does not raise any events.

      Returns Node | null

    • Gets or sets the original Link being reconnected by the RelinkingTool. Setting this property does not raise any events.

      Returns Link | null

    • get originalToNode(): Node | null

      Gets or sets the original Node to which the new link is being drawn or to which the originalLink was connected when being relinked. Setting this property does not raise any events.

      Returns Node | null

    • get portGravity(): number

      Gets or sets the distance at which link snapping occurs. The default value is 100.0. The value must be non-negative. Setting this property does not raise any events.

      Returns number

    • get portTargeted(): | (
          (node: Node | null, port: GraphObject | null, tempNode: Node, tempPort: GraphObject, toEnd: boolean) => void
      )
      | null

      Gets or sets a function that is called as the tool targets the nearest valid port. The first two arguments specify the port by providing the Node that it is in and the GraphObject that is the actual port object. The next two arguments are the temporary port that has been moved and styled to be like the valid port. These values will be either the temporaryToNode and temporaryToPort or the temporaryFromNode and temporaryFromPort, depending on which end of the temporary link is being updated. The fifth argument is true if the target port represents a potential "to" end of a link; it is false if it is for the "from" end of a link.

      When there is no valid port within the portGravity, the first two arguments are null.

      The function, if supplied, must not add or remove any links or nodes or port objects, nor may it change the validity of any potential link connection.

      Returns ((node: Node | null, port: GraphObject | null, tempNode: Node, tempPort: GraphObject, toEnd: boolean) => void) | null

    • get startObject(): GraphObject | null

      Gets or sets the GraphObject at which findLinkablePort should start its search. The default value is null. Setting this property does not raise any events.

      If you want to explicitly start a new user mouse-gesture to draw a new link from a given GraphObject that may be a "port" object or may be within the visual tree of a "port" object, set this property to that object to let findLinkablePort find the real "port" object. Then start and activate this tool:

        const tool = myDiagram.toolManager.linkingTool;
      tool.startObject = ...;
      myDiagram.currentTool = tool;
      tool.doActivate();

      Returns GraphObject | null

    • get targetPort(): GraphObject | null

      Gets or sets a proposed GraphObject port for connecting a link. Whether this is a "to" port or a "from" port depends on the direction (isForwards) in which the link is being drawn or reconnected.

      This is set when the mouse is being dragged and when a mouse-up event occurs with the result of a call to findTargetPort. Setting this property does not raise any events.

      Returns GraphObject | null

    • get temporaryFromNode(): Node

      Gets or sets the temporary Node at the "from" end of the temporaryLink while the user is drawing or reconnecting a link. Setting this property does not raise any events.

      Returns Node

    • get temporaryFromPort(): GraphObject

      Gets or sets the GraphObject that is the port at the "from" end of the temporaryLink while the user is drawing or reconnecting a link. Setting this property does not raise any events.

      Returns GraphObject

    • Gets or sets the temporary Link that is shown while the user is drawing or reconnecting a link. Setting this property does not raise any events.

      Returns Link

    • get temporaryToNode(): Node

      Gets or sets the temporary Node at the "to" end of the temporaryLink while the user is drawing or reconnecting a link. Setting this property does not raise any events.

      Returns Node

    • get temporaryToPort(): GraphObject

      Gets or sets the GraphObject that is the port at the "to" end of the temporaryLink while the user is drawing or reconnecting a link. Setting this property does not raise any events.

      Returns GraphObject

    • get transactionResult(): string | null

      Gets or sets the name of the transaction to be committed by stopTransaction

      If null, the transaction will be rolled back.

      If this is non-null at the time of a call to stopTransaction, it calls Diagram.commitTransaction with this transaction name; if this is null at that time, it calls Diagram.rollbackTransaction.

      The default value is null; startTransaction will also set this to null. Because a value of null when stopTransaction is called will rollback the transaction, it is important that your code sets this property to a non-null value when it thinks it has succeeded.

      This property exists so that no matter what execution path occurs to end the usage of a tool, any ongoing transaction can be properly committed or rolled-back. Many tools call startTransaction and stopTransaction; thus they set this property for their transaction to be committed. doCancel also sets this property to null.

      Returns string | null

    Methods

    • This is called to cancel any running "WaitAfter" timer.

      This is called when a tool is stopped.

      This method is rarely overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • This tool can run when the diagram allows linking, the model is modifiable, the left-button mouse drag has moved far enough away to not be a click, and when findLinkablePort has returned a valid port or when startObject is a valid port.

      This method may be overridden, but we recommend that you call this base method.

      Returns boolean

    • This method controls for some Tools whether canStart may return true depending on the button being used. Normally this returns true if InputEvent.left is true. This method may be overridden to consider other buttons, or to ignore which button by just returning true.

      Returns boolean

      true, if the left mouse button is being held down

      since

      4.0

    • Make a temporary port look and act like a real one.

      This is called by doMouseMove as the tool finds new valid target ports. If findTargetPort returns null, it calls setNoTargetPortProperties instead.

      If the portTargeted property is a function, that function is called. It is easier to customize the behavior by setting that functional property than it is to override this method and the setNoTargetPortProperties method. But you may want to call this method to get the standard behavior for dynamically adapting the temporary node/port to "act like" the target port. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns void

    • The diagram will call this method when the user wishes to cancel the current tool's operation. Typically this is called when the user hits the ESCAPE key. This should restore the original state of what was modified by this tool, and then it should call stopTool. This method is not responsible for cleaning up any side-effects that should be performed by doDeactivate and/or doStop, which will always be called whether the tool stops normally or abnormally.

      By default this method just sets transactionResult to null and calls stopTool. You will want to override this method even in tools that call startTransaction and stopTransaction, because the UndoManager might not be enabled. This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • Finishing the linking operation stops the transaction, releases the mouse, and resets the cursor.

      This method may be overridden, but we recommend that you call this base method.

      Returns void

    • The diagram will call this method upon a key down event. By default this just calls doCancel if the key is the ESCAPE key. Implementations of this method can look at Diagram.lastInput to get the key.

      This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • The diagram will call this method upon a key up event. Implementations of this method can look at Diagram.lastInput to get the key.

      By default this method does nothing. This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • Mouse movement results in a temporary node moving to where a valid target port is located, or to where the mouse is if there is no valid target port nearby.

      This calls findTargetPort to update the targetPort given the new mouse point. If a valid target port is found this moves the temporary node/port and makes them appear like the target node/port by calling copyPortProperties. If no valid target port is found, this moves the temporary node to where the mouse currently is and removes any node/port appearance, by calling setNoTargetPortProperties.

      This method may be overridden, but we recommend that you call this base method.

      Returns void

    • A mouse-up ends the linking operation; if there is a valid targetPort nearby, this adds a new Link by calling insertLink.

      If there is a new link, it is selected and the "LinkDrawn" DiagramEvent is raised with the new link as the DiagramEvent.subject. If there is no new link, this calls doNoLink. In any case this stops the tool.

      This method also raises the "ChangingSelection" and "ChangedSelection" diagram events. Changes are performed in a "Linking" transaction, but the "ChangedSelection" event is raised outside the transaction.

      This method may be overridden, but we recommend that you call this base method. It is usually easier to override insertLink or just set archetypeLinkData. It is also common to implement a "LinkDrawn" DiagramEvent listener on the Diagram.

      Returns void

    • This method is called upon a mouse up when no new link is drawn, either because no valid LinkingBaseTool.targetPort was found or because insertLink returned null.

      This method may be overridden. By default this method does nothing. If you want to successfully perform any side-effects, you will need to set Tool.transactionResult to a string; otherwise this tool's transaction will be rolled-back. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      • fromnode: Node | null
      • fromport: GraphObject | null

        the from-port, or null to use the node itself

      • tonode: Node | null
      • toport: GraphObject | null

        the to-port, or null to use the node itself

      Returns void

    • The Diagram calls this method when this tool becomes the current tool; you should not call this method. Tool implementations should perform their per-use initialization here, such as setting up internal data structures, or capturing the mouse. Implementations of this method can look at Diagram.lastInput to get the mouse event and input state.

      You should not call this method -- only the Diagram.currentTool property setter should call this method.

      By default this method does nothing. This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      If you override this method, it is commonplace to also override doStop to clean up whatever you set up in this method.

      Returns void

    • Find a port with which the user could complete a valid link.

      This finds objects near to the current mouse point for which a valid link connection is possible.

      For each port element found, this calls isValidLink to find out if a link between the original node/port and the found node/port would be valid. The result is saved in a cache for faster decisions later during operation of this tool. The closest valid port is returned.

      This method may be overridden, but we recommend that you call this base method. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      • toend: boolean

        true if looking for a "to" port.

      Returns GraphObject | null

      a valid port, or null if no such port is near the current mouse point within the portGravity distance.

    • This convenience function finds the front-most GraphObject that is at a given point and that is an element of an Adornment that is of a given category. The tool handle must be an immediate element of the Adornment, not a GraphObject that is nested within Panels within the Adornment.

      This method is very infrequently overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns GraphObject | null

    • Make a copy of the archetypeLinkData, set its node and port properties, and add it to the GraphLinksModel. If the model is a TreeModel, set the parent key of the child's node data object.

      For GraphLinksModels, if archetypeLabelNodeData is non-null, this method also adds that node data as an initial label node for the new link data.

      For TreeModels, if Diagram.isTreePathToChildren is false, the roles of the fromnode and tonode arguments are exchanged.

      This method may be overridden, but we recommend that you call this base method. Usually though it is easiest to just set archetypeLinkData to control what kind of link is created. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      • fromnode: Node | null
      • fromport: GraphObject | null

        the from-port, or null to use the node itself

      • tonode: Node | null
      • toport: GraphObject | null

        the to-port, or null to use the node itself

      Returns Link | null

      the newly created Link, or null if it failed.

    • This predicate is true if both argument ports are in the same Node. This is called by isValidLink.

      This method may be overridden, but we recommend that you call this base method. It is rare that you will want to override this method. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns boolean

    • This predicate is true if there is a link in the diagram going from the given port to the given port. This is called by isValidLink.

      This method may be overridden, but we recommend that you call this base method. It is rare that you will want to override this method. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns boolean

    • Checks whether a proposed link would be valid according to Diagram.validCycle. This does not distinguish between different ports on a node, so this method does not need to take port arguments. This is called by isValidLink.

      This method may be overridden, but we recommend that you call this base method. It is rare that you will want to override this method. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      • from: Node | null
      • to: Node | null
      • Optionalignore: Link | null

        may be null; this is useful during relinking to ignore the originalLink

      Returns boolean

    • Reset a temporary port's properties to neutral values when there is no target port.

      This is called by doMouseMove when the tool finds no new valid target port. If findTargetPort returns non-null, it calls copyPortProperties instead.

      If the portTargeted property is a function, that function is called with null values as the first two arguments. It is easier to customize the behavior by setting that functional property than it is to override this method and the copyPortProperties method. But you may want to call this method to get the standard behavior for dynamically adapting the temporary node/port to "act like" it is not connecting with any target port. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns void

    • Implement the standard behavior for mouse clicks, searching for and calling click handler functions on GraphObjects or on Diagram, and raising the corresponding DiagramEvent.

      A click on a GraphObject of the diagram will raise one of the following DiagramEvents: "ObjectSingleClicked", "ObjectDoubleClicked", or "ObjectContextClicked". This will also look at the corresponding click property: GraphObject.click, GraphObject.doubleClick, or GraphObject.contextClick. If the value is a function, this will call it, passing the current InputEvent and the GraphObject. If the value is null, it tries looking at the parent GraphObject.panel, and so on, walking up the visual tree until it finds the appropriate function to call. After calling the click function, if the value of InputEvent.handled is false, this method will continue walking up the visual tree looking for more click functions to call. Once it has looked at the top-level object (a Part) for a click function, this method stops.

      A click in the background of the diagram will raise one of the following DiagramEvents: "BackgroundSingleClicked", "BackgroundDoubleClicked", or "BackgroundContextClicked". This will also look at the corresponding click property: Diagram.click, Diagram.doubleClick, or Diagram.contextClick. If the value is a function, this will call it, passing the current InputEvent.

      This method is not responsible for selecting or deselecting any parts. Call standardMouseSelect for that functionality.

      Note that this calls GraphObject.isEnabledObject on the target object; if it returns false, no click action will occur.

      The ClickSelectingTool calls this method in its override of doMouseUp in order to raise "click" events. Note that by default GraphObjects in Layers that are Layer.isTemporary will not be "clicked". To change that behavior it is easiest to set GraphObject.isActionable to true on those objects for which you wish to handle "click" events. Then the ActionTool's doMouseUp override will raise the standard "click" events.

      This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Type Parameters

      Parameters

      • Optionalnavig: ((a: GraphObject) => T | null) | null

        An optional custom navigation function to find target objects. This argument is passed to Diagram.findObjectAt.

      • Optionalpred: ((a: T) => boolean) | null

        An optional custom predicate function to find target objects. A null value is effectively the same as a function that always returns true. This argument is passed to Diagram.findObjectAt, unless the value is undefined, which means to use a predicate to consider only objects in layers holding permanent objects.

      Returns boolean

      true if InputEvent.handled had been set to true on the Diagram.lastInput.

    • Implement the standard behavior for mouse enter, over, and leave events, where the mouse is moving but no button is pressed. This should be called by mouse move event handlers when wanting to detect and invoke mouse enter/over/leave event handlers.

      The GraphObject.mouseEnter property provides a function to call when the mouse first enters an object or any of its contained objects (if the object is actually a Panel).

      The GraphObject.mouseLeave property provides a function to call when the mouse leaves an object and all of its contained objects (if the object is actually a Panel).

      The GraphObject.mouseOver property and Diagram.mouseOver properties provide functions to call when the mouse moves but stays within the same GraphObject or when the mouse moves in the background of the Diagram.

      This method is also responsible for updating the Diagram.currentCursor according to the value of GraphObject.cursor and Diagram.defaultCursor.

      This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • Implement the standard behavior for selecting parts with the mouse, depending on the control and shift modifier keys.

      Control-clicking on a part will select it if it wasn't already, and will deselect if it had been selected. Shift-clicking on a part will add it to the selection (if it wasn't already). Otherwise, clicking on a part will select it (if it wasn't already).

      Note that there are restrictions on selection. For example, a part cannot be selected in this manner if Part.selectable is false, or if Diagram.maxSelectionCount would be exceeded.

      A left click in the background of the diagram with no modifier keys clears the selection.

      This method does not implement any click event behavior -- that is implemented by standardMouseClick.

      The ClickSelectingTool calls this method in its override of doMouseUp in order to change the selection.

      This method may be overridden, but you should consider calling this base method in order to get all of its functionality. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • This is called to start a new timer to call doWaitAfter after a given delay. It first cancels any previously running "WaitAfter" timer, by calling cancelWaitAfter.

      This is normally used to implement mouse hover and mouse hold events. If the mouse has moved, it must not have moved beyond the distance as determined by Tool.isBeyondDragSize for it be considered "stationary". So the regular ToolManager.doMouseMove implementation only calls this method when the mouse has moved beyond the drag size.

      This method is rarely overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns void

    • If the Diagram.currentTool is this tool, stop this tool and start the Diagram.defaultTool by making it be the new current tool. The implementation of various tool methods can call this method to stop the current tool. This will call doStop -- you should not call that method directly.

      If you want to stop the current tool and have it restore the original state, call doCancel. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Returns void

    • The diagram asks each tool to update any adornments the tool might use for a given part. If the tool uses its own tool handles, this should display them or hide them as appropriate. Typically this should only show them if the part is selected.

      By default this method does nothing. This method may be overridden. Please read the Learn page on Extensions for how to override methods and how to call this base method.

      Parameters

      Returns void

    Properties

    BackwardsOnly: BackwardsOnly = LinkingDirection.BackwardsOnly
    Either: Either = LinkingDirection.Either
    deprecated

    See LinkingDirection.Either.

    ForwardsOnly: ForwardsOnly = LinkingDirection.ForwardsOnly