# Interface Renderer

The main interface through which rendering can be achieved.

Multiple renderers are permitted on a single page.

interface Renderer {
canvasSize: ReadonlyVec2;
insights: RendererInfo | null;
viewAreaSize: ReadonlyVec2;
addDrawable<T extends Drawable>(drawable: T): void;
destroy(): void;
displayToWorldCoordinates(displayCoordinates: ReadonlyVec2): vec2;
renderDrawables(): void;
setRuntimeSettings(overrides: Partial<RuntimeSettings>): void;
setViewArea(topLeft: ReadonlyVec2, size: ReadonlyVec2): void;
worldToDisplayCoordinates(worldCoordinates: ReadonlyVec2): vec2;
}

- Defined in graphics/rendering/renderer/renderer.ts:11

##### Index

### Properties

canvasSize
insights
viewAreaSize

### Methods

addDrawable
destroy
displayToWorldCoordinates
renderDrawables
setRuntimeSettings
setViewArea
worldToDisplayCoordinates

## Properties

### `Readonly` canvasSize

canvasSize: ReadonlyVec2

Get the actual resolution of the canvas without triggering a reflow.

A ResizeObserver is used to achieve this.

- Defined in graphics/rendering/renderer/renderer.ts:17

### `Readonly` insights

insights: RendererInfo | null

Get useful information about the hardware and the SDF2D renderer.

Its schema is subject to change.

During a context-lost event, it might be null.

- Defined in graphics/rendering/renderer/renderer.ts:96

### `Readonly` viewAreaSize

viewAreaSize: ReadonlyVec2

Get the viewArea size set by the last `setViewArea`.

By default, `canvasSize` is used for the view area size.

- Defined in graphics/rendering/renderer/renderer.ts:24

## Methods

### addDrawable

- addDrawable<T extends Drawable>(drawable: T): void

  Schedule a drawable to be rendered during the next `renderDrawables` call.

  #### Type Parameters

  - T extends Drawable

  #### Parameters

  - drawable: T

    Must be a subclass of drawable and its class must contain a static descriptor property of type [[DrawableDescriptor]].

  #### Returns void

  - Defined in graphics/rendering/renderer/renderer.ts:71

### destroy

- destroy(): void

  Let go of every GPU resource held by the renderer.

  It's up to the browser and driver whether these resources are actually freed. Nonetheless, when a renderer is no longer needed, this method should be called.

  #### Returns void

  - Defined in graphics/rendering/renderer/renderer.ts:87

### displayToWorldCoordinates

- displayToWorldCoordinates(displayCoordinates: ReadonlyVec2): vec2

  The inverse of `worldToDisplayCoordinates`, returns the world coordinates from a pixel's position.

  The view area coordinates are also given in world coordinates.

  Useful for picking.

  #### Parameters

  - displayCoordinates: ReadonlyVec2

    The origin is in the display's top left corner. Just as in mouse events' clientX and clientY.

  #### Returns vec2

  - Defined in graphics/rendering/renderer/renderer.ts:46

### renderDrawables

- renderDrawables(): void

  Render every drawable added since the last `renderDrawables` call.

  Resizing of framebuffers and the canvas also takes effect when calling `renderDrawables`.

  #### Returns void

  - Defined in graphics/rendering/renderer/renderer.ts:79

### setRuntimeSettings

- setRuntimeSettings(overrides: Partial<RuntimeSettings>): void

  Patch the current runtime settings with new values.

  #### Parameters

  - overrides: Partial<RuntimeSettings>

  #### Returns void

  - Defined in graphics/rendering/renderer/renderer.ts:63

### setViewArea

- setViewArea(topLeft: ReadonlyVec2, size: ReadonlyVec2): void

  Set the camera transformation.

  #### Parameters

  - topLeft: ReadonlyVec2

    top (!) left. By default, equal to [0, canvasHeight].

  - size: ReadonlyVec2

    need not be equal to the canvas size, though their aspect ratio should be the same to avoid stretching.

  #### Returns void

  - Defined in graphics/rendering/renderer/renderer.ts:33

### worldToDisplayCoordinates

- worldToDisplayCoordinates(worldCoordinates: ReadonlyVec2): vec2

  The inverse of `displayToWorldCoordinates`, returns the screen space position of a point given in world space coordinates.

  While the origin for worldCoordinates resides in the bottom-left corner, the origin of the returned display coordinates is placed in the top left.

  #### Parameters

  - worldCoordinates: ReadonlyVec2

    Coordinates used when drawing objects.

  #### Returns vec2

  - Defined in graphics/rendering/renderer/renderer.ts:57