marker.js 3 Documentation
    Preparing search index...

    Class FreehandMarker

    Freehand marker represents a hand drawing.

    Unlike v2 in v3 freehand marker is represented by an SVG path element. This means that the line properties like stroke color, width, dasharray, etc. can be modified after drawing.

    Hierarchy (View Summary)

    Index

    Accessors

    • get container(): SVGGElement

      SVG container object holding the marker's visual.

      Returns SVGGElement

    Constructors

    Methods

    Properties

    _container: SVGGElement

    SVG container object holding the marker's visual.

    It is created and passed to the constructor by marker editor or viewer when creating the marker.

    _fillColor: string = 'transparent'

    Fill color of the marker.

    _opacity: number = 1

    Opacity of the marker.

    _strokeColor: string = 'transparent'

    Stroke (outline) color of the marker.

    _strokeDasharray: string = ''

    Stroke (outline) dash array of the marker.

    _strokeWidth: number = 0

    Stroke (outline) width of the marker.

    applyDefaultFilter: boolean = false

    When true, the default filter is applied to the marker's visual.

    3.2.0

    defaultSize: ISize = ...

    The default marker size when the marker is created with a click (without dragging).

    notes?: string

    Additional information about the marker.

    Generally, this isn't used for anything functional. However, in a derived type it could be used for storing arbitrary data with no need to create extra properties and state types.

    points: IPoint[] = []

    Points of the freehand line.

    selectorVisual: undefined | SVGGraphicsElement

    Wider invisible visual to make it easier to select and manipulate the marker.

    stage: MarkerStage = 'normal'

    Marker lifecycle stage.

    Most markers are created immediately after the user clicks on the canvas (normal). However, some markers are only finished creating after additional interactions (creating).

    title: string = 'Freehand marker'

    Marker type title (display name) used for accessibility and other attributes.

    typeName: string = 'FreehandMarker'

    Marker type name.

    It's important to set this in each derived class. This value is used to identify marker types when restoring marker state and other scenarios.

    visibleVisual: undefined | SVGGraphicsElement

    Visible visual of the marker.

    visual: undefined | SVGGraphicsElement

    Marker's main visual.