@ue-too/board / index / CanvasProxy

クラス: CanvasProxy

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:196

A proxy for the canvas element to prevent constant invoking of the getBoundingClientRect method.

Remarks

This is mainly used as a proxy to the canvas to prevent invoking the getBoundingClientRect method on the canvas every time a pointer event is triggered or a coordinate conversion is needed. Also to autoscale the canvas buffer depending on the device pixel ratio. It's important to note that in normal circumstances, you would not need to set the size of the canvas manually; you should use the css style width and height to set the size of the canvas.

参照

• Canvas for the interface that this class implements
• Observable for the observable that this class emits
• Observer for the observer that can subscribe to the observable
• SubscriptionOptions for the options that can be passed to the subscribe method
• SynchronousObservable for the synchronous observable that this class emits
• CanvasPositionDimensionPublisher for the publisher that is used to publish the canvas dimensions

実装

• Canvas
• Observable<[CanvasDimensions]>

コンストラクター

コンストラクター

new CanvasProxy(canvas?): CanvasProxy

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:204

パラメータ

canvas?

HTMLCanvasElement

戻り値

CanvasProxy

アクセッサー

detached

署名を取得する

get detached(): boolean

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:255

Whether the canvas is currently detached from the DOM

戻り値

boolean

Whether the canvas is currently detached from the DOM

の実装

Canvas.detached

---

dimensions

署名を取得する

get dimensions(): object

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:259

Combined dimensions and position information

戻り値

object

height

height: number

position

position: Point

width

width: number

Combined dimensions and position information

の実装

Canvas.dimensions

---

height

署名を取得する

get height(): number

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:335

The canvas height in CSS pixels

戻り値

number

The canvas height in CSS pixels

の実装

Canvas.height

---

position

署名を取得する

get position(): Point

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:339

The top-left position of the canvas in window coordinates

戻り値

Point

The top-left position of the canvas in window coordinates

の実装

Canvas.position

---

width

署名を取得する

get width(): number

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:267

The canvas width in CSS pixels

戻り値

number

The canvas width in CSS pixels

の実装

Canvas.width

メソッド

attach()

attach(canvas): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:357

パラメータ

canvas

HTMLCanvasElement

戻り値

void

---

notify()

notify(...data): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:251

パラメータ

data

...[CanvasDimensions]

戻り値

void

の実装

Observable.notify

---

setCanvasHeight()

setCanvasHeight(height): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:314

パラメータ

height

number

戻り値

void

---

setCanvasWidth()

setCanvasWidth(width): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:282

パラメータ

width

number

戻り値

void

---

setCursor()

setCursor(style): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:343

Sets the CSS cursor style for visual feedback

パラメータ

style

"grab" | "default" | "grabbing"

戻り値

void

の実装

Canvas.setCursor

---

setHeight()

setHeight(height): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:307

set the height of the canvas the height is synonymous with the canvas style height not the canvas height

パラメータ

height

number

戻り値

void

---

setWidth()

setWidth(width): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:275

set the width of the canvas the width is synonymous with the canvas style width not the canvas width

パラメータ

width

number

戻り値

void

---

subscribe()

subscribe(observer, options?): () => void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:244

パラメータ

observer

Observer<[CanvasDimensions]>

options?

SubscriptionOptions

戻り値

(): void

戻り値

void

の実装

Observable.subscribe

---

tearDown()

tearDown(): void

定義: packages/board/src/input-interpretation/input-state-machine/kmt-input-context.ts:349

Cleanup method to dispose of resources and event listeners

戻り値

void

の実装

Canvas.tearDown