SnapSettingsModel

23 Sep 20251 minute to read

Interface for a class SnapSettings

Properties

constraints SnapConstraints

Constraints for gridlines and snapping

  • None - Snapping does not happen
  • ShowHorizontalLines - Displays only the horizontal gridlines in diagram.
  • ShowVerticalLines - Displays only the Vertical gridlines in diagram.
  • ShowLines - Display both Horizontal and Vertical gridlines.
  • SnapToHorizontalLines - Enables the object to snap only with horizontal gridlines.
  • SnapToVerticalLines - Enables the object to snap only with horizontal gridlines.
  • SnapToLines - Enables the object to snap with both horizontal and Vertical gridlines.
  • snapToObject - Enables the object to snap with the other objects in the diagram.

gridType GridType

Defines the diagram Grid pattern.

  • Lines - Render the line for the grid
  • Dots - Render the dot for the grid

horizontalGridlines GridlinesModel

Defines the horizontal gridlines

<div id='diagram'></div>
let horizontalGridlines: GridlinesModel = {lineColor: 'black', lineDashArray: '1,1' };
let verticalGridlines: GridlinesModel = {lineColor: 'black', lineDashArray: '1,1'};
let diagram: Diagram = new Diagram({
...
snapSettings: { horizontalGridlines, verticalGridlines, constraints: SnapConstraints.ShowLines,
snapObjectDistance: 5, snapAngle: 5 },
...
});
diagram.appendTo('#diagram');

snapAngle number

Defines the angle by which the object needs to be snapped

snapLineColor string

Defines the color of snapping lines

snapObjectDistance number

Sets the minimum distance between the selected object and the nearest object

verticalGridlines GridlinesModel

Defines the vertical gridlines