# Class GuidedDraggingTool

GoJS® Diagramming Components
version 3.0.14
by Northwoods Software®

This is an extension and not part of the main GoJS library. Note that the API for this class may change at any time. If you intend to use an extension in production, you should copy the code to your own source directory. See the Extensions intro page for more information.

#### Hierarchy

- DraggingTool
  - GuidedDraggingTool

The GuidedDraggingTool class makes guidelines visible as the parts are dragged around a diagram when the selected part is nearly aligned with another part.

If you want to experiment with this extension, try the Guided Dragging sample.

#####
Index

### Constructors

constructor

### Accessors

centerGuidelineColor
guidelineSnapDistance
guidelineWidth
horizontalGuidelineColor
isGuidelineEnabled
isGuidelineSnapEnabled
searchDistance
verticalGuidelineColor

### Methods

clearGuidelines
doDeactivate
doDragOver
doDropOnto
invalidateLinks
isGuiding
showHorizontalMatches
showVerticalMatches

### Properties

guidelineHbottom
guidelineHcenter
guidelineHtop
guidelineVcenter
guidelineVleft
guidelineVright

#####
Inherited Index

### Accessors

DraggingTool.copiedParts
DraggingTool.copiesEffectiveCollection
DraggingTool.copyCursor
DraggingTool.currentPart
DraggingTool.delay
DraggingTool.dragOptions
DraggingTool.draggedParts
DraggingTool.dragsLink
DraggingTool.dragsTree
DraggingTool.gridSnapCellSize
DraggingTool.gridSnapCellSpot
DraggingTool.gridSnapOrigin
DraggingTool.isComplexRoutingRealtime
DraggingTool.isCopyEnabled
DraggingTool.isGridSnapEnabled
DraggingTool.isGridSnapRealtime
DraggingTool.moveCursor
DraggingTool.nodropCursor
DraggingTool.startPoint
Tool.diagram
Tool.isActive
Tool.isEnabled
Tool.name
Tool.transactionResult

### Methods

DraggingTool.canStart
DraggingTool.computeEffectiveCollection
DraggingTool.computeMove
DraggingTool.doActivate
DraggingTool.doCancel
DraggingTool.doKeyDown
DraggingTool.doKeyUp
DraggingTool.doMouseMove
DraggingTool.doMouseUp
DraggingTool.findDraggablePart
DraggingTool.mayCopy
DraggingTool.mayMove
DraggingTool.moveParts
DraggingTool.standardMouseSelect
DraggingTool.stopTransaction
Tool.canStartMultiTouch
Tool.cancelWaitAfter
Tool.doMouseDown
Tool.doMouseWheel
Tool.doStart
Tool.doStop
Tool.doWaitAfter
Tool.findToolHandleAt
Tool.isBeyondDragSize
Tool.standardMouseClick
Tool.standardMouseOver
Tool.standardMouseWheel
Tool.standardPinchZoomMove
Tool.standardPinchZoomStart
Tool.standardWaitAfter
Tool.startTransaction
Tool.stopTool
Tool.updateAdornments

## Constructors

### constructor

- new GuidedDraggingTool(init?: Partial<GuidedDraggingTool>): GuidedDraggingTool

- Constructs a GuidedDraggingTool and sets up the temporary guideline parts.

  #### Parameters

  - ##### `Optional` init: Partial<GuidedDraggingTool>

  #### Returns GuidedDraggingTool

## Accessors

### centerGuidelineColor
: string

- Gets or sets the color of center guidelines.

  The default value is "gray".

### guidelineSnapDistance
: number

- Gets or sets the margin of error for which guidelines show up.

  The default value is 6. Guidelines will show up when the aligned nodes are ± 6px away from perfect alignment.

### guidelineWidth
: number

- Gets or sets the strokeWidth of the guidelines.

  The default value is 1.

### horizontalGuidelineColor
: string

- Gets or sets the color of horizontal guidelines.

  The default value is "gray".

### isGuidelineEnabled
: boolean

- Gets or sets whether the guidelines are enabled or disables.

  The default value is true.

### isGuidelineSnapEnabled
: boolean

- Gets or sets whether snapping to guidelines is enabled.

  The default value is true.

### searchDistance
: number

- Gets or sets the distance around the selected part to search for aligned parts.

  The default value is 1000. Set this to Infinity if you want to search the entire diagram no matter how far away.

### verticalGuidelineColor
: string

- Gets or sets the color of vertical guidelines.

  The default value is "gray".

## Methods

### clearGuidelines

- clearGuidelines(): void

- Removes all of the guidelines from the grid.

  #### Returns void

### `Override` doDeactivate

- doDeactivate(): void

- Calls the base method and removes the guidelines from the graph.

  #### Returns void

### `Override` doDragOver

- doDragOver(pt: Point, obj: GraphObject): void

- Shows vertical and horizontal guidelines for the dragged part.

  #### Parameters

  - ##### pt: Point

  - ##### obj: GraphObject

  #### Returns void

### `Override` doDropOnto

- doDropOnto(pt: Point, obj: GraphObject): void

- On a mouse-up, snaps the selected part to the nearest guideline. If not snapping, the part remains at its position.

  #### Parameters

  - ##### pt: Point

  - ##### obj: GraphObject

  #### Returns void

### invalidateLinks

- invalidateLinks(node: Part): void

- When nodes are shifted due to being guided upon a drop, make sure all connected link routes are invalidated, since the node is likely to have moved a different amount than all its connected links in the regular operation of the DraggingTool.

  #### Parameters

  - ##### node: Part

  #### Returns void

### `Protected` isGuiding

- isGuiding(part: Part, guidedpart: Part): boolean

- This predicate decides whether or not the given Part should guide the dragged part.

  #### Parameters

  - ##### part: Part

    a stationary Part to which the dragged part might be aligned

  - ##### guidedpart: Part

    the Part being dragged

  #### Returns boolean

### showHorizontalMatches

- showHorizontalMatches(part: Part, guideline: boolean, snap: boolean): void

- This finds parts that are aligned near the selected part along horizontal lines. It compares the selected part to all parts within a rectangle approximately twice the searchDistance wide. The guidelines appear when a part is aligned within a margin-of-error equal to guidelineSnapDistance.

  #### Parameters

  - ##### part: Part

  - ##### guideline: boolean

    if true, show guideline

  - ##### snap: boolean

    if true, snap the part to where the guideline would be

  #### Returns void

### showVerticalMatches

- showVerticalMatches(part: Part, guideline: boolean, snap: boolean): void

- This finds parts that are aligned near the selected part along vertical lines. It compares the selected part to all parts within a rectangle approximately twice the searchDistance tall. The guidelines appear when a part is aligned within a margin-of-error equal to guidelineSnapDistance.

  #### Parameters

  - ##### part: Part

  - ##### guideline: boolean

    if true, show guideline

  - ##### snap: boolean

    if true, don't show guidelines but just snap the part to where the guideline would be

  #### Returns void

## Properties

### guidelineHbottom
: Part

### guidelineHcenter
: Part

### guidelineHtop
: Part

### guidelineVcenter
: Part

### guidelineVleft
: Part

### guidelineVright
: Part

Copyright © 1998-2024 by Northwoods Software Corporation.