Skip to content

Freehand

Freehand

Extends

Constructors

new Freehand()

new Freehand(): Freehand

Returns

Freehand

Overrides

Path.constructor

Source

shapes.ts:2258

Properties

children

children: Obj[]

Inherited from

Path.children

Source

core/obj.ts:14


connectable

connectable: boolean

Connectable flag

Inherited from

Path.connectable

Source

shapes.ts:199


constraints

constraints: Constraint[]

Shape’s constraints

Inherited from

Path.constraints

Source

shapes.ts:299


containable

containable: boolean

Containable flag

Inherited from

Path.containable

Source

shapes.ts:189


containableFilter

containableFilter: string

Containable filter

Inherited from

Path.containableFilter

Source

shapes.ts:194


description

description: string

Description of the shape

Inherited from

Path.description

Source

shapes.ts:149


enable

enable: boolean

Enable flag

Inherited from

Path.enable

Source

shapes.ts:164


fillColor

fillColor: string

Fill color

Inherited from

Path.fillColor

Source

shapes.ts:244


fillStyle

fillStyle: string

Fill style

Inherited from

Path.fillStyle

Source

shapes.ts:249


fontColor

fontColor: string

Font color

Inherited from

Path.fontColor

Source

shapes.ts:254


fontFamily

fontFamily: string

Font family

Inherited from

Path.fontFamily

Source

shapes.ts:259


fontSize

fontSize: number

Font size

Inherited from

Path.fontSize

Source

shapes.ts:264


fontStyle

fontStyle: string

Font style

Inherited from

Path.fontStyle

Source

shapes.ts:269


fontWeight

fontWeight: number

Font weight

Inherited from

Path.fontWeight

Source

shapes.ts:274


headTaper

headTaper: number

Taper at the end of the path. The value must be between 0 and 1.

Source

shapes.ts:2256


height

height: number

Shape’s height

Inherited from

Path.height

Source

shapes.ts:219


id

id: string

Inherited from

Path.id

Source

core/obj.ts:11


left

left: number

Shape’s left position

Inherited from

Path.left

Source

shapes.ts:204


link: string

Link

Inherited from

Path.link

Source

shapes.ts:289


movable

movable: MovableEnum

Indicate how this shape can be moved

Inherited from

Path.movable

Source

shapes.ts:174


name

name: string

Name of the shape

Inherited from

Path.name

Source

shapes.ts:144


opacity

opacity: number

Opacity

Inherited from

Path.opacity

Source

shapes.ts:279


parent

parent: null | Obj

Inherited from

Path.parent

Source

core/obj.ts:13


path

path: number[][]

Inherited from

Path.path

Source

shapes.ts:1527


pathEditable

pathEditable: boolean

Inherited from

Path.pathEditable

Source

shapes.ts:1526


properties

properties: Property[]

Shape’s properties

Inherited from

Path.properties

Source

shapes.ts:304


proto

proto: boolean

The flag to indicate this shape is a prototype or not

Inherited from

Path.proto

Source

shapes.ts:154


reference

reference: null | Shape

A reference to shape

Inherited from

Path.reference

Source

shapes.ts:294


rotatable

rotatable: boolean

Rotatable flag

Inherited from

Path.rotatable

Source

shapes.ts:184


rotate

rotate: number

Shape’s rotation angle (in degree)

Inherited from

Path.rotate

Source

shapes.ts:224


roughness

roughness: number

Roughness

Inherited from

Path.roughness

Source

shapes.ts:284


scripts

scripts: Script[]

Shape’s scripts

Inherited from

Path.scripts

Source

shapes.ts:309


sizable

sizable: SizableEnum

Indicate how this shape can be resized

Inherited from

Path.sizable

Source

shapes.ts:179


strokeColor

strokeColor: string

Stroke color

Inherited from

Path.strokeColor

Source

shapes.ts:229


strokePattern

strokePattern: number[]

Stroke pattern

Inherited from

Path.strokePattern

Source

shapes.ts:239


strokeWidth

strokeWidth: number

Stroke width

Inherited from

Path.strokeWidth

Source

shapes.ts:234


tags

tags: string[]

Tags

Inherited from

Path.tags

Source

shapes.ts:159


tailTaper

tailTaper: number

Taper at the start of the path. The value must be between 0 and 1.

Source

shapes.ts:2251


thinning

thinning: number

Thinning

Source

shapes.ts:2246


top

top: number

Shape’s top position

Inherited from

Path.top

Source

shapes.ts:209


type

type: string

Inherited from

Path.type

Source

core/obj.ts:12


visible

visible: boolean

Visible flag

Inherited from

Path.visible

Source

shapes.ts:169


width

width: number

Shape’s width

Inherited from

Path.width

Source

shapes.ts:214

Accessors

bottom

get bottom(): number

Returns

number

Source

shapes.ts:482


get right(): number

Returns

number

Source

shapes.ts:478

Methods

assignStyles()

assignStyles(canvas): void

Assign styles to memoization canvas.

Parameters

canvas: MemoizationCanvas

Returns

void

Inherited from

Path.assignStyles

Source

shapes.ts:560


canContain()

canContain(shape): boolean

Determine a given shape can be contained in this shape

Parameters

shape: Shape

Returns

boolean

Inherited from

Path.canContain

Source

shapes.ts:994


computeOpacity()

computeOpacity(): number

Returns

number

Inherited from

Path.computeOpacity

Source

shapes.ts:550


containsPoint()

containsPoint(canvas, point): boolean

Determines whether this shape contains a point in GCS

Parameters

canvas: Canvas

point: number[]

Returns

boolean

Inherited from

Path.containsPoint

Source

shapes.ts:1571


draw()

draw(canvas, showDOM): void

Draw this shape

Render vs Draw

  • Render: computing geometries how to draw the shape
  • Draw: actual drawing the computed geometries of the shape on the canvas

Parameters

canvas: Canvas

showDOM: boolean= false

Returns

void

Inherited from

Path.draw

Source

shapes.ts:697


drawLink(canvas, showDOM): void

Draw link

Parameters

canvas: Canvas

showDOM: boolean= false

Returns

void

Inherited from

Path.drawLink

Source

shapes.ts:711


finalize()

finalize(canvas): void

Finalize shape

Parameters

canvas: Canvas

Returns

void

Inherited from

Path.finalize

Source

shapes.ts:499


find()

find(pred): null | Obj

Find an shape in breath-first order

Parameters

pred

Returns

null | Obj

Inherited from

Path.find

Source

core/obj.ts:106


findAllByQuery()

findAllByQuery(queryString): Shape[]

Find all shapes matched with the query string

Parameters

queryString: string

Returns

Shape[]

Inherited from

Path.findAllByQuery

Source

shapes.ts:984


findByQuery()

findByQuery(queryString): null | Shape

Find a shape first matched with the query string

Parameters

queryString: any

Returns

null | Shape

Inherited from

Path.findByQuery

Source

shapes.ts:971


findDepthFirst()

findDepthFirst(pred): null | Obj

Find an shape in depth-first order

Parameters

pred

Returns

null | Obj

Inherited from

Path.findDepthFirst

Source

core/obj.ts:119


findParent()

findParent(pred): null | Obj

Find a shape along with the parent-chain

Parameters

pred

Returns

null | Obj

Inherited from

Path.findParent

Source

core/obj.ts:132


fromJSON()

fromJSON(json): void

Import shape from JSON

Parameters

json: any

Returns

void

Overrides

Path.fromJSON

Source

shapes.ts:2274


getBoundingRect()

getBoundingRect(includeAnchorPoints): number[][]

Return a bounding rect.

Parameters

includeAnchorPoints: boolean= false

Returns

number[][]

Inherited from

Path.getBoundingRect

Source

shapes.ts:758


getCenter()

getCenter(): number[]

Returns the center point

Returns

number[]

Inherited from

Path.getCenter

Source

shapes.ts:751


getChildrenBoundingRect()

getChildrenBoundingRect(): number[][]

Return a bounding box embracing children shapes

Returns

number[][]

Inherited from

Path.getChildrenBoundingRect

Source

shapes.ts:807


getEnclosure()

getEnclosure(): number[][]

Return a enclosure

Returns

number[][]

Inherited from

Path.getEnclosure

Source

shapes.ts:841


getEndSegment()

getEndSegment(isHead): number[][]

Return a segment of an end

Parameters

isHead: boolean

Returns

number[][]

segment line to end

Inherited from

Path.getEndSegment

Source

shapes.ts:1562


getOutline()

getOutline(): number[][]

Return outline polygon.

Returns

number[][]

Inherited from

Path.getOutline

Source

shapes.ts:686


getProperty()

getProperty(name): any

Get a property object

Parameters

name: string

Returns

any

Inherited from

Path.getProperty

Source

shapes.ts:1006


getPropertyValue()

getPropertyValue(name): any

Get a property value

Parameters

name: string

Returns

any

Inherited from

Path.getPropertyValue

Source

shapes.ts:1016


getRectInDCS()

getRectInDCS(canvas, includeAnchorPoints): number[][]

Return a bounding box in DOM coord.

[Note] If you want to place DOM elements over the canvas, use this method. and don’t forget to apply transform scale to the DOM element.

Parameters

canvas: Canvas

includeAnchorPoints: boolean= false

Returns

number[][]

Inherited from

Path.getRectInDCS

Source

shapes.ts:820


getScript()

getScript(id): undefined | string

Get a property object

Parameters

id: string

Returns

undefined | string

Inherited from

Path.getScript

Source

shapes.ts:1024


getSeed()

getSeed(): number

Returns

number

Inherited from

Path.getSeed

Source

shapes.ts:486


getShapeAt()

getShapeAt(canvas, point, exceptions): null | Shape

Pick a shape at specific position (x, y)

Parameters

canvas: Canvas

point: number[]

exceptions: Shape[]= []

Returns

null | Shape

Inherited from

Path.getShapeAt

Source

shapes.ts:519


getViewport()

getViewport(canvas): number[][]

Return a viewport in GCS. Viewport is a rect that includes actually drawn area which includes stroke width, arrowheads, etc. So viewport is mostly larger than bounding rect.

Parameters

canvas: Canvas

Returns

number[][]

Inherited from

Path.getViewport

Source

shapes.ts:800


initialze()

initialze(canvas): void

Initialize shape

Parameters

canvas: Canvas

Returns

void

Inherited from

Path.initialze

Source

shapes.ts:494


isClosed()

isClosed(): boolean

Return is the path is closed

Returns

boolean

Inherited from

Path.isClosed

Source

shapes.ts:1553


isDescendant()

isDescendant(obj): boolean

Test whether the given shape is a descendant

Parameters

obj: Obj

Returns

boolean

Inherited from

Path.isDescendant

Source

core/obj.ts:142


localCoordTransform()

localCoordTransform(canvas, point, recursive): number[]

Transform local coord to parent’s coord (LCS —> parent’s LCS) if recursive=true, transform to GCS (Global coord-system).

Parameters

canvas: Canvas

point: number[]

recursive: boolean= false

Returns

number[]

Inherited from

Path.localCoordTransform

Source

shapes.ts:596


localCoordTransformRev()

localCoordTransformRev(canvas, point, recursive): number[]

Transform parent’s coord to local coord (parent’s LCS —> LCS) if recursive=true, transform GCS (Global coord-system) —> LCS.

Parameters

canvas: Canvas

point: number[]

recursive: boolean= false

Returns

number[]

Inherited from

Path.localCoordTransformRev

Source

shapes.ts:616


localTransform()

localTransform(canvas, recursive): void

Transform local context to parent’s context

Parameters

canvas: Canvas

recursive: boolean= false

Returns

void

Inherited from

Path.localTransform

Source

shapes.ts:580


match()

match(query): boolean

Returns true if query matches this shape

Parameters

query: object[]

Returns

boolean

Inherited from

Path.match

Source

shapes.ts:946


overlapClippingArea()

overlapClippingArea(canvas, rect): boolean

Determines whether the given rect overlaps this shape’s clipping area. If the shape don’t have clipping area, return true. If the shape has clipping area, return true if the rect overlaps the clipping area. (e.g. Frame)

Parameters

canvas: Canvas

rect: number[][]

Returns

boolean

Inherited from

Path.overlapClippingArea

Source

shapes.ts:877


overlapRect()

overlapRect(canvas, rect): boolean

Determines whether this shape overlaps a given rect

Parameters

canvas: Canvas

rect: number[][]

Returns

boolean

Inherited from

Path.overlapRect

Source

shapes.ts:1594


parseQueryString()

parseQueryString(queryString): any[]

Parse the query-string and returns a query object (JSON)

Query syntax: = [”|” ]* = [”&” ]* = | = e.g.) OuterBox, NameText, … = ”@” e.g.) @Box, @Text, @Line, … = ”#” e.g.) #label, #compartment, …

e.g.) parseQuery(“@Box|NameText|@Text&#compartment”) —> [{_type: “Box”},{name: “NameText”},{_type: “Text”, tag:“compartment”}]

Parameters

queryString: string

Returns

any[]

query object

Inherited from

Path.parseQueryString

Source

shapes.ts:921


render()

render(canvas): void

Render this shape

Render vs Draw

  • Render: computing geometries how to draw the shape
  • Draw: actual drawing the computed geometries of the shape on the canvas

Parameters

canvas: MemoizationCanvas

Returns

void

Inherited from

Path.render

Source

shapes.ts:639


renderDefault()

renderDefault(canvas): void

Default render this shape

Parameters

canvas: MemoizationCanvas

Returns

void

Overrides

Path.renderDefault

Source

shapes.ts:2281


renderOutline()

renderOutline(canvas): void

Render this shape’s outline

Parameters

canvas: MemoizationCanvas

Returns

void

Inherited from

Path.renderOutline

Source

shapes.ts:663


renderOutlineDefault()

renderOutlineDefault(canvas): number[][]

Return default outline

Parameters

canvas: MemoizationCanvas

Returns

number[][]

Inherited from

Path.renderOutlineDefault

Source

shapes.ts:1605


renderViewport()

renderViewport(canvas): void

Return this shape’s viewport

Parameters

canvas: MemoizationCanvas

Returns

void

Inherited from

Path.renderViewport

Source

shapes.ts:768


renderViewportDefault()

renderViewportDefault(canvas): number[][]

Render default viewport

Parameters

canvas: MemoizationCanvas

Returns

number[][]

Inherited from

Path.renderViewportDefault

Source

shapes.ts:784


resolveRefs()

resolveRefs(idMap, nullIfNotFound): void

Resolve references

Parameters

idMap: Record<string, Shape>

id to object map

nullIfNotFound: boolean= false

assign null if not found

Returns

void

Inherited from

Path.resolveRefs

Source

shapes.ts:467


toJSON()

toJSON(recursive, keepRefs): any

Export shape to JSON

Parameters

recursive: boolean= false

keepRefs: boolean= false

Returns

any

Overrides

Path.toJSON

Source

shapes.ts:2266


traverse()

traverse(fun, parent): void

Traverse all objects in breath-first order

Parameters

fun

parent: null | Obj= null

Returns

void

Inherited from

Path.traverse

Source

core/obj.ts:60


traverseDepthFirst()

traverseDepthFirst(fun, parent): void

Traverse all shapes in depth-first order

Parameters

fun

parent: null | Obj= null

Returns

void

Inherited from

Path.traverseDepthFirst

Source

core/obj.ts:74


traverseDepthFirstSequence()

traverseDepthFirstSequence(): Obj[]

Returns an array of shapes in order of traverse sequence.

Returns

Obj[]

Inherited from

Path.traverseDepthFirstSequence

Source

core/obj.ts:97


traverseSequence()

traverseSequence(): Obj[]

Returns an array of shapes in order of traverse sequence.

Returns

Obj[]

Inherited from

Path.traverseSequence

Source

core/obj.ts:88


update()

update(canvas): void

Update shape

Parameters

canvas: Canvas

Returns

void

Inherited from

Path.update

Source

shapes.ts:509


visit()

visit(fun, parent): void

Visit all shapes in breath-first order. The difference from traverse() is that each shape determine visit into children or not. (e.g. Group and Frame doens’t visit into children)

Parameters

fun

parent: null | Shape= null

Returns

void

Inherited from

Path.visit

Source

shapes.ts:539