PencilBrush

Defined in: src/brushes/PencilBrush.ts:19

See

demo

Extends

• BaseBrush

Extended by

• PatternBrush

Constructors

new PencilBrush()

new PencilBrush(canvas): PencilBrush

Defined in: src/brushes/PencilBrush.ts:47

Parameters

canvas

Canvas

Returns

PencilBrush

Overrides

BaseBrush.constructor

Properties

canvas

canvas: Canvas

Defined in: src/brushes/BaseBrush.ts:73

Todo

add type

Inherited from

BaseBrush.canvas

---

color

color: string = 'rgb(0, 0, 0)'

Defined in: src/brushes/BaseBrush.ts:16

Color of a brush

Default

Inherited from

BaseBrush.color

---

decimate

decimate: number = 0.4

Defined in: src/brushes/PencilBrush.ts:25

Discard points that are less than decimate pixel distant from each other

Default

0.4

---

drawStraightLine

drawStraightLine: boolean = false

Defined in: src/brushes/PencilBrush.ts:34

Draws a straight line between last recorded point to current pointer Used for shift functionality

Default

false

---

limitedToCanvasSize

limitedToCanvasSize: boolean = false

Defined in: src/brushes/BaseBrush.ts:68

When true, the free drawing is limited to the whiteboard size. Default to false.

Default

false

Inherited from

BaseBrush.limitedToCanvasSize

---

shadow

shadow: null | Shadow = null

Defined in: src/brushes/BaseBrush.ts:32

Shadow object representing shadow of this shape. Backwards incompatibility note: This property replaces “shadowColor” (String), “shadowOffsetX” (Number), “shadowOffsetY” (Number) and “shadowBlur” (Number) since v1.2.12

Default

Inherited from

BaseBrush.shadow

---

straightLineKey

straightLineKey: undefined | null | "altKey" | "ctrlKey" | "metaKey" | "shiftKey" = 'shiftKey'

Defined in: src/brushes/PencilBrush.ts:41

The event modifier key that makes the brush draw a straight line. If null or ‘none’ or any other string that is not a modifier key the feature is disabled.

---

strokeDashArray

strokeDashArray: null | number[] = null

Defined in: src/brushes/BaseBrush.ts:60

Stroke Dash Array.

Default

Inherited from

BaseBrush.strokeDashArray

---

strokeLineCap

strokeLineCap: CanvasLineCap = 'round'

Defined in: src/brushes/BaseBrush.ts:39

Line endings style of a brush (one of “butt”, “round”, “square”)

Default

Inherited from

BaseBrush.strokeLineCap

---

strokeLineJoin

strokeLineJoin: CanvasLineJoin = 'round'

Defined in: src/brushes/BaseBrush.ts:46

Corner style of a brush (one of “bevel”, “round”, “miter”)

Default

Inherited from

BaseBrush.strokeLineJoin

---

strokeMiterLimit

strokeMiterLimit: number = 10

Defined in: src/brushes/BaseBrush.ts:53

Maximum miter length (used for strokeLineJoin = “miter”) of a brush’s

Default

Inherited from

BaseBrush.strokeMiterLimit

---

width

width: number = 1

Defined in: src/brushes/BaseBrush.ts:23

Width of a brush, has to be a Number, no string literals

Default

Inherited from

BaseBrush.width

Methods

_finalizeAndAddPath()

_finalizeAndAddPath(): void

Defined in: src/brushes/PencilBrush.ts:273

On mouseup after drawing the path on contextTop canvas we use the points captured to create an new Path object and add it to the canvas.

Returns

void

---

convertPointsToSVGPath()

convertPointsToSVGPath(points): TSimplePathData

Defined in: src/brushes/PencilBrush.ts:212

Converts points to SVG path

Parameters

points

Point[]

Array of points

Returns

TSimplePathData

SVG path commands

---

createPath()

createPath(pathData): Path

Defined in: src/brushes/PencilBrush.ts:222

Creates a Path object to add on canvas

Parameters

pathData

TSimplePathData

Path data

Returns

Path

Path to add on canvas

---

decimatePoints()

decimatePoints(points, distance): Point[]

Defined in: src/brushes/PencilBrush.ts:243

Decimate points array with the decimate value

Parameters

points

Point[]

distance

number

Returns

Point[]

---

needsFullRender()

needsFullRender(): boolean

Defined in: src/brushes/PencilBrush.ts:53

Returns

boolean

Overrides

BaseBrush.needsFullRender

---

onMouseDown()

onMouseDown(pointer, __namedParameters): void

Defined in: src/brushes/PencilBrush.ts:67

Invoked on mouse down

Parameters

pointer

Point

__namedParameters

TEvent

Returns

void

Overrides

BaseBrush.onMouseDown

---

onMouseMove()

onMouseMove(pointer, __namedParameters): void

Defined in: src/brushes/PencilBrush.ts:83

Invoked on mouse move

Parameters

pointer

Point

__namedParameters

TEvent

Returns

void

Overrides

BaseBrush.onMouseMove

---

onMouseUp()

onMouseUp(__namedParameters): boolean

Defined in: src/brushes/PencilBrush.ts:121

Invoked on mouse up

Parameters

__namedParameters

TEvent

Returns

boolean

Overrides

BaseBrush.onMouseUp

---

drawSegment()

static drawSegment(ctx, p1, p2): Point

Defined in: src/brushes/PencilBrush.ts:57

Parameters

ctx

CanvasRenderingContext2D

p1

Point

p2

Point

Returns

Point