DiagramRulerModel

23 Sep 20251 minute to read

Interface for a class DiagramRuler

Properties

arrangeTick Function|string

Defines the method which is used to position and arrange the tick elements of the ruler.

<div id='diagram'></div>

let arrange: Function = (args: IArrangeTickOptions) => {
if (args.tickInterval % 10 == 0) {
args.tickLength = 25;
}
}
let diagram: Diagram = new Diagram({
...
rulerSettings: { showRulers: true,
horizontalRuler: { segmentWidth: 50, orientation: 'Horizontal', interval: 10,  arrangeTick: arrange },
verticalRuler: {segmentWidth: 200,interval: 20, thickness: 20,
tickAlignment: 'LeftOrTop', segmentWidth: 50, markerColor: 'red' }
},
...
});
diagram.appendTo('#diagram');

interval number

Defines the number of intervals to be present on each segment of the ruler.

markerColor string

Defines the color of the ruler marker brush.

orientation RulerOrientation

Defines the orientation of the ruler

segmentWidth number

Defines the textual description of the ruler segment, and the appearance of the ruler ticks of the ruler.

thickness number

Defines the height of the ruler.

tickAlignment TickAlignment

Defines and sets the tick alignment of the ruler scale.