Remarks
Snapping is enabled for IGraph items by setting an instance of this on the GraphEditorInputMode as snapContext.
This class provides a set of properties that determine the way snapping operations are being performed in the context of IGraphs.
IPositionHandler implementations and the like can retrieve instances of this class from the IInputModeContext.
Examples
mode.snapContext = new GraphSnapContext()mode.snapContext = new GraphSnapContext({
nodeDistance: 30,
collectNodePairCenterSnapLines: true,
collectNodePairSegmentSnapLines: false,
})const snapContext = inputModeContext.lookup(GraphSnapContext)
if (snapContext?.isInitializing) {
// ...
}See Also
Developer's Guide
API
- GraphEditorInputMode, snapContext
Demos
- Shows how to enable snapping (guide lines) for interactive changes.
Members
Constructors
Properties
Gets the items that were affected by the drag gesture.
Gets or sets the grid constraint provider for the IBends.
Property Value
null if none is set.Examples
const snapContext = new GraphSnapContext()
const gridInfo = new GridInfo(50, 50)
snapContext.nodeGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.bendGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.portGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.gridSnapType = GridSnapTypes.GRID_POINTS
graphEditorInputMode.snapContext = snapContextGets or sets whether this instance should collect snap references for fixed edge segments.
true.See Also
Developer's Guide
API
- ISnapReferenceProvider, collectFixedSegmentSnapReferences
Note that this will only make a difference for differently sized nodes.
By default this feature is turned off, so that the instance will try to distribute nodes evenly, so that there is the same spacing between their borders, not between their centers.
See Also
Developer's Guide
Property Value
true if pairs of nodes should be collected for additional edge snap lines; false otherwise. The default is trueSee Also
Developer's Guide
Property Value
true if pairs of nodes should be collected for additional snap lines; false otherwise. The default is trueSee Also
Developer's Guide
Gets or sets whether this instance should collect the sizes of fixed nodes.
Gets or sets whether this instance should collect snap references for fixed nodes.
true.See Also
Developer's Guide
API
- ISnapReferenceProvider, collectFixedNodeSnapReferences
Gets or sets whether this instance should collect snap references for fixed ports.
true.See Also
Developer's Guide
API
- ISnapReferenceProvider, collectFixedPortSnapReferences
false.Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
true.Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
true.Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
true.Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
true.Property Value
true if this instance should collect snap lines for the initial position of a label; false otherwise.See Also
Developer's Guide
Note that the label snaps to these snap lines with the side that is closer to the node's border. That way, snapping to such a snap line preserves the perceived distance from the node border for both labels inside and outside the node bounds.
The default is false.
Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
Note that the label snaps to these snap lines with the side that is closer to the node's border. That way, snapping to such a snap line preserves the perceived distance from the node border for both labels inside and outside the node bounds.
The default is true.
Property Value
true if this instance should collect snap lines through the border and center of the label owner; otherwise, false.See Also
Developer's Guide
Note that the label snaps to these snap lines with the side that is closer to the node's border. That way, snapping to such a snap line preserves the perceived distance from the node border for both labels inside and outside the node bounds.
The default is true.
Property Value
true if this instance should collect this kind of snap lines; false otherwise.See Also
Developer's Guide
true.Property Value
true if this instance should collect snap lines through the border and center of the label owner; otherwise, false.See Also
Developer's Guide
true.Property Value
true if this instance should collect snap lines through the center of the label owner; otherwise, false.See Also
Developer's Guide
Note that only croppable OrthogonalSnapLines are considered for cropping.
The default is true.
See Also
Developer's Guide
Gets the current input mode context.
This will influence the creation of the segment snap lines. For each orthogonally oriented fixed segment there will be snap lines on the segment itself and to both sides of the segment at the specified distance.
The default is 0.0d which disables parallel snap lines.
See Also
Developer's Guide
Gets or sets a value indicating whether this SnapContext is enabled.
Property Value
true if enabled; false otherwise.See Also
Developer's Guide
Defined in
SnapContext.enabledGets the nodes that stay fixed for the current edit.
Property Value
Defined in
SnapContext.gridSnapDistanceGets or sets which types of items IGridConstraintProvider<T> implementations should snap.
Additionally to this selection of item types, it is necessary to specify the corresponding IGridConstraintProvider<T>.
Note that items may still snap to other items or SnapReferences when the necessary result providers are registered, and they are included in the snappableItems.
The default is ALL.
See Also
Developer's Guide
Gets or sets the type of the grid snapping that should be performed.
Examples
Enabling grid snapping
const snapContext = new GraphSnapContext()
const gridInfo = new GridInfo(50, 50)
snapContext.nodeGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.bendGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.portGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.gridSnapType = GridSnapTypes.GRID_POINTS
graphEditorInputMode.snapContext = snapContextNote that the grid visualization has to be enabled separately
graphComponent.renderTree.createElement(
graphComponent.renderTree.backgroundGroup,
gridInfo,
new GridRenderer(),
)See Also
Defined in
SnapContext.gridSnapTypeDefined in
SnapContext.isInitializedProperty Value
true if this instance is initializing; false otherwise.See Also
Defined in
SnapContext.isInitializingThis will influence the creation of the node snap lines. For each fixed node there will be snap lines on the borders of the node itself and around the node at the specified distance.
The default is 0.0d which disables distant snap lines around the nodes.
See Also
Developer's Guide
Gets or sets the grid constraint provider for the INodes.
Property Value
null if none is set.Examples
const snapContext = new GraphSnapContext()
const gridInfo = new GridInfo(50, 50)
snapContext.nodeGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.bendGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.portGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.gridSnapType = GridSnapTypes.GRID_POINTS
graphEditorInputMode.snapContext = snapContextThis will influence the creation of the node snap lines. For each fixed node there will be snap lines on the borders of the node itself and around the node at the specified distance to which orthogonal edge segments can snap.
The default is -1.0d which disables distant snap lines around the nodes for edge segments.
See Also
Developer's Guide
Gets the original location of the mouse at the time the gesture was initialized.
Gets or sets the grid constraint provider for the IPorts.
Property Value
null if none is set.Examples
const snapContext = new GraphSnapContext()
const gridInfo = new GridInfo(50, 50)
snapContext.nodeGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.bendGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.portGridConstraintProvider = new GridConstraintProvider(
gridInfo,
)
snapContext.gridSnapType = GridSnapTypes.GRID_POINTS
graphEditorInputMode.snapContext = snapContextThe distance is interpreted in view coordinates.
The default is 5.0d
See Also
API
- snapDistance
Defined in
SnapContext.snapDistance40.0d, this value will be used to extend the ends of the snap lines.See Also
Developer's Guide
Gets or sets which types of items snap result provider implementations should snap.
Note that items may still snap to the grid when the necessary IGridConstraintProvider<T> are registered, and they are included in the gridSnappableItems.
The default is NODE | ORTHOGONAL_SEGMENT | PORT_ADJACENT_SEGMENT | BEND_ADJACENT_SEGMENT | LABEL
See Also
Developer's Guide
Gets the collection of snapReferences other than OrthogonalSnapLines.
true. snappableItems should be used to determine if the moved item may be snapped to these references.Gets the collection of SnapResults.
Defined in
SnapContext.snapResultsProperty Value
true if the results should be visualized, false otherwise.See Also
Defined in
SnapContext.visualizeSnapResultsMethods
Adds MovementInfo representing an IBend that will be considered for the next drag gesture.
Parameters
- info: MovementInfo
- The MovementInfo representing the bend to be moved. Can be created with getMovementInfo.
Adds MovementInfo representing the end of an IEdge that will be considered for the next drag gesture.
Parameters
- info: MovementInfo
- The MovementInfo representing the edge end to be reparented. Can be created with getMovementInfos.
- sourceEnd: boolean
trueif theinforepresents the source end of the edge.
Adds an item which will be reshaped.
Parameters
- item: IModelItem
- The item to be reshaped.
Adds MovementInfo representing an ILabel that will be considered for the next drag gesture.
Parameters
- info: MovementInfo
- The MovementInfo representing the label to be moved. Can be created with getMovementInfo.
Adds MovementInfo representing an INode that will be considered for the next drag gesture.
Parameters
- info: MovementInfo
- The MovementInfo representing the node to be moved. Can be created with getMovementInfo.
Adds an orthogonally moved segment to this context for which this instance will automatically collect SnapResults and provide a default visualization.
Parameters
- start: MovementInfo
- The starting point of the manipulated segment.
- end: MovementInfo
- The end point of the manipulated segment.
Adds MovementInfo representing an IPort that will be considered for the next drag gesture.
Parameters
- info: MovementInfo
- The MovementInfo representing the port to be moved. Can be created with getMovementInfo.
Adds an entry for the same-height-snapping.
Parameters
- rectangle: Rect
- The rectangle to obtain the height value from. This rectangle will be used for the snap result visualization.
See Also
Adds an entry for the same-width-snapping.
Parameters
- rectangle: Rect
- The rectangle to obtain the width value from. This rectangle will be used for the snap result visualization.
See Also
Defined in
SnapContext.cancelDragDisposes of all previously temporarily collected state and clears the snapResults collection.
Overrides
SnapContext.cleanUpCollects the SnapReferences for the nodes which are not moving.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
Collects the SnapReferences for the ports which are not moving.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
Collects snap references for edge segments.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
Collects SnapGrids for bends, ports, and nodes if the corresponding bendGridConstraintProvider, portGridConstraintProvider, or nodeGridConstraintProvider are set.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
See Also
Developer's Guide
Collects all node widths and heights in collections used by the SnapSize.
Collects first the entries with same size and then SnapSize for snapping to the width and height of these sizes.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
Finds pairs of nodes that are visually adjacent to create center and same distance snap lines.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs required for adding snap references.
Helper method used by createSnapResultsModelManager to create the IObjectRenderer<SnapResult> for the SnapResult type.
Return Value
- IObjectRenderer<SnapResult>
- An instance that can install SnapResults in a CanvasComponent.
Defined in
SnapContext.createSnapResultRenderercreateSnapResultsModelManager
(canvasComponent: CanvasComponent): CollectionModelManager<SnapResult>Helper method that creates a CollectionModelManager<T> that can be used to present the current SnapResults in the provided CanvasComponent.
createSnapResultsModelManager
(canvasComponent: CanvasComponent): CollectionModelManager<SnapResult>Parameters
- canvasComponent: CanvasComponent
- The control to initialize the CollectionModelManager<T> with.
Return Value
- CollectionModelManager<SnapResult>
- The model manager that manages the visual representation of the SnapResults.
Parameters
- newLocation: Point
- The current mouse location.
- snappingDisabled: boolean
- If set to
truesnapping is temporarily disabled. This will remove the snap reference visualizations and return the unchanged coordinates.
Return Value
- Point
- The adjusted coordinates or the unchanged coordinates if snapping has been temporarily disabled by setting
snappingDisabledtotrue.
Defined in
SnapContext.dragFinishedThis method needs to be called by the client IInputMode that initialized this instance after it has performed the actual move operation with the adjusted coordinates after a call to handleMove.
snappingDisabled parameter set to true.Parameters
- mouseLocation: Point
- The actual mouse location.
- finalLocation: Point
- The final snap location that has been used by the client code for the move.
Defined in
SnapContext.draggedSee Also
Overrides
SnapContext.dragInitializedGets the movement info for the given bend.
Parameters
- bend: IBend
- The bend to obtain the info for.
Return Value
- MovementInfo
- An instance of MovementInfo that describes the movement of the bend.
Gets the movement info for the given node.
Parameters
- node: INode
- The node to obtain the info for.
Return Value
- MovementInfo
- An instance of MovementInfo that describes the movement of the node.
Gets the movement info for the given label.
Parameters
- label: ILabel
- The node to obtain the info for.
Return Value
- MovementInfo
- An instance of MovementInfo that describes the movement of the node.
Gets the movement info for the given port.
Parameters
- port: IPort
- The port to obtain the info for.
Return Value
- MovementInfo
- An instance of MovementInfo that describes the movement of the port.
Gets the MovementInfo for the provided edge.
Parameters
- edge: IEdge
- The edge to obtain the movement information of.
Return Value
- IListEnumerable<MovementInfo>
- An IListEnumerable<T> of MovementInfo items that describe the geometry of the edge being modified.
snappingDisabled has to be set to true.Parameters
- newLocation: Point
- The current mouse location.
- snappingDisabled: boolean
- If set to
true, snapping is temporarily disabled. This will remove the snap reference visualizations and return the unchanged coordinates.
Return Value
- Point
- The adjusted coordinates or the unchanged coordinates if snapping has been temporarily disabled by setting
snappingDisabledtotrue.
Defined in
SnapContext.handleMoveCalled by IInputMode implementations when an interactive drag is started.
Parameters
- context: IInputModeContext
- The context in which the interactive drag is started.
- originalLocation: Point
- The original location of the mouse.
Throws
- Exception ({ name: 'InvalidOperationError' })
- If this context is already initialized.
Overrides
SnapContext.initializeDragRaises the cleanUp event.
Parameters
- evt: InputModeEventArgs
- The InputModeEventArgs instance containing the event data.
Defined in
SnapContext.onCleanUpRaises the collect-snap-references event.
Parameters
- evt: CollectSnapReferencesEventArgs
- The CollectSnapReferencesEventArgs instance containing the event data.
Raises the collect-snap-results event.
Parameters
- evt: CollectSnapResultsEventArgs
- The CollectSnapResultsEventArgs instance containing the event data.
Defined in
SnapContext.onCollectSnapResultsRaises the initialized event.
Parameters
- evt: InputModeEventArgs
- The InputModeEventArgs instance containing the event data.
Defined in
SnapContext.onInitializedRaises the initializing event.
Parameters
- evt: InputModeEventArgs
- The InputModeEventArgs instance containing the event data.
Defined in
SnapContext.onInitializingChooses the current SnapResults from a temporary list.
Parameters
- snapResults: List<SnapResult>
- A temporary list of suggested SnapResults.
- originalLocation: Point
- The point in world coordinates where the mouse move started.
- newLocation: Point
- The current mouse location.
Return Value
- Point
- The adjusted coordinates.
Defined in
SnapContext.processSnapResultsHelper method that wraps the given context so that a lookup query on the wrapped context for the SnapContext type yields this instance.
context so that a lookup query on the wrapped context for the SnapContext type yields this instance.Parameters
- context: IInputModeContext
- The context to wrap and delegate all calls to.
Return Value
- IInputModeContext
- A modified instance that yields this instance if it is queried for the SnapContext type.
Overrides
SnapContext.wrapContextEvents
Occurs when this instance has been cleaned up.
Properties of
InputModeEventArgs- context: IInputModeContext
- Gets the context for the current event.
See Also
API
- cleanUp
Defined in
SnapContext.cleaned-upOccurs every time this instance has been initialized to collect OrthogonalSnapLines.
Properties of
CollectSnapReferencesEventArgs- context: IInputModeContext
- Gets the context for the current event.
See Also
Developer's Guide
Occurs while moving items and handles.
The moving model items must register for this event, preferably in the initializeDrag method of the IDragHandler.
The event handler has to add SnapResults for the moving object to the list. The IDragHandlers of the moved items have to take care themselves whether to add a handler to the list depending on their settings.
Properties of
CollectSnapResultsEventArgs- context: IInputModeContext
- Gets the context for the current event.
- delta: Point
- Gets the vector by which the mouse has been moved since initialization of the snapping process.
- gridSnapDistance: number
- Gets the zoom invariant grid snap distance.
- newLocation: Point
- Gets the new (current) location of the mouse that is going to be manipulated by the snapping process.
- originalLocation: Point
- Gets the original location of the mouse at the beginning of the gesture.
- snapDistance: number
- Gets the zoom invariant snap distance.
Defined in
SnapContext.collect-snap-resultsOccurs when this instance has been initialized.
Properties of
InputModeEventArgs- context: IInputModeContext
- Gets the context for the current event.
See Also
Defined in
SnapContext.initializedOccurs when this instance is about to be initialized.
Properties of
InputModeEventArgs- context: IInputModeContext
- Gets the context for the current event.