Class Viewport

Accessors

canvasToScreenTransform

get canvasToScreenTransform(): Mat33
Returns Mat33
- Defined in js-draw/src/Viewport.ts:145

screenToCanvasTransform

get screenToCanvasTransform(): Mat33
Returns Mat33
- Defined in js-draw/src/Viewport.ts:141

visibleRect

get visibleRect(): Rect2
Get the screen's visible region transformed into canvas space.

Returns Rect2
- Defined in js-draw/src/Viewport.ts:111

Methods

canvasToScreen

canvasToScreen(canvasPoint: Vec3): Vec3
Parameters
- canvasPoint: Vec3
Returns Vec3
the given point transformed into screen coordinates.
- Defined in js-draw/src/Viewport.ts:121

computeZoomToTransform

computeZoomToTransform(
    toMakeVisible: Rect2,
    allowZoomIn?: boolean,
    allowZoomOut?: boolean,
): Mat33
Computes and returns an affine transformation that makes toMakeVisible visible and roughly centered on the screen.
Parameters
- toMakeVisible: Rect2
- allowZoomIn: boolean = true
- allowZoomOut: boolean = true
Returns Mat33
- Defined in js-draw/src/Viewport.ts:265

getResolution

getResolution(): Vec3
Alias for getScreenRectSize.

Returns Vec3
Deprecated
- Defined in js-draw/src/Viewport.ts:155

getRotationAngle

getRotationAngle(): number
Returns number
the angle of the canvas in radians. This is the angle by which the canvas is rotated relative to the screen.

Returns an angle in the range $[-\pi, \pi]$ (the same range as Vec3.angle).
- Defined in js-draw/src/Viewport.ts:214

getScaleFactor

getScaleFactor(): number
Returns number
the amount a vector on the canvas is scaled to become a vector on the screen.
- Defined in js-draw/src/Viewport.ts:160

getScaleFactorToNearestPowerOfTen

getScaleFactorToNearestPowerOfTen(): number
Returns number
getScaleFactor() rounded to the nearest power of 10. For example, if getScaleFactor() returns 101, getScaleFactorToNearestPowerOfTen() should return 100 because 100 is the nearest power of 10 to 101.
- Defined in js-draw/src/Viewport.ts:170

getScreenRectSize

getScreenRectSize(): Vec3
Returns Vec3
the size of the visible region in pixels (screen units).
- Defined in js-draw/src/Viewport.ts:150

getSizeOfPixelOnCanvas

getSizeOfPixelOnCanvas(): number
Returns the size of one screen pixel in canvas units.

Returns number
- Defined in js-draw/src/Viewport.ts:204

getTemporaryClone

getTemporaryClone(): Viewport
Returns Viewport
a temporary copy of this that does not notify when modified. This is useful when rendering with a temporarily different viewport.
- Defined in js-draw/src/Viewport.ts:96

resetTransform

resetTransform(newTransform?: Mat33): void
Updates the transformation directly. Using transformBy is preferred.
Parameters
- newTransform: Mat33 = Mat33.identity
  should map from canvas coordinates to screen coordinates.
Returns void
- Defined in js-draw/src/Viewport.ts:134

roundPoint

roundPoint(point: Vec3): Vec3
Round a point with a tolerance of ±1 screen unit.
Parameters
- point: Vec3
Returns Vec3
- Defined in js-draw/src/Viewport.ts:243

screenToCanvas

screenToCanvas(screenPoint: Vec3): Vec3
Parameters
- screenPoint: Vec3
Returns Vec3
the given point, but in canvas coordinates
- Defined in js-draw/src/Viewport.ts:116

snapToGrid

snapToGrid(canvasPos: Vec3): Vec2Impl
Snaps canvasPos to the nearest grid cell corner.
Parameters
- canvasPos: Vec3
Returns Vec2Impl
See
getGridSize.
- Defined in js-draw/src/Viewport.ts:189

zoomTo

zoomTo(
    toMakeVisible: Rect2,
    allowZoomIn?: boolean,
    allowZoomOut?: boolean,
): Command
Returns a Command that transforms the view such that [rect] is visible, and perhaps centered in the viewport. Returns null if no transformation is necessary
Parameters
- toMakeVisible: Rect2
- allowZoomIn: boolean = true
- allowZoomOut: boolean = true
Returns Command
See
computeZoomToTransform
- Defined in js-draw/src/Viewport.ts:344

`Static`getGridSize

getGridSize(scaleFactor: number): number
Returns the size of a grid cell (in canvas units) as used by snapToGrid.
Parameters
- scaleFactor: number
Returns number
- Defined in js-draw/src/Viewport.ts:180

`Static`roundPoint

roundPoint<T extends number | Vec3>(
point: T,
tolerance: number,
): PointDataType<T>
Rounds the given point to a multiple of 10 such that it is within tolerance of its original location. This is useful for preparing data for base-10 conversion.
Type Parameters
- T extends number | Vec3
Parameters
- point: T
- tolerance: number
Returns PointDataType<T>
- Defined in js-draw/src/Viewport.ts:222

`Static`roundScaleRatio

roundScaleRatio(scaleRatio: number, roundAmount?: number): number
roundAmount: An integer >= 0, larger numbers cause less rounding. Smaller numbers cause more (as such roundAmount = 0 does the most rounding).
Parameters
- scaleRatio: number
- roundAmount: number = 1
Returns number
- Defined in js-draw/src/Viewport.ts:249

`Static`transformBy

transformBy(transform: Mat33): ViewportTransform
Parameters
- transform: Mat33
Returns ViewportTransform
a command that transforms the canvas by transform.
- Defined in js-draw/src/Viewport.ts:126

OpenSource licenses