# Renderer | SDF-2D - v0.5.3
Documentation for SDF-2D - v0.5.3

The main interface through which rendering can be achieved.

Multiple renderers are permitted on a single page.

### Hierarchy

- Renderer

## Index

### Properties

- canvasSize
- insights
- viewAreaSize

### Methods

- addDrawable
- autoscaleQuality
- destroy
- displayToWorldCoordinates
- renderDrawables
- setRuntimeSettings
- setViewArea

## Properties

### Readonly canvasSize

canvasSize: vec2

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

Get the actual resolution of the canvas.

### Readonly insights

insights: any

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

experimental

  Debug information updated on each `renderDrawables` call. Its scheme is not yet defined. The main purpose of this is human debugging.

### Readonly viewAreaSize

viewAreaSize: vec2

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

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

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

## Methods

### addDrawable

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

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

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

  #### Type parameters

  - #### T: Drawable

  #### Parameters

  - ##### drawable: T

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

  #### Returns void

### autoscaleQuality

- autoscaleQuality(deltaTime: DOMHighResTimeStamp): void

- - Defined in graphics/rendering/renderer/renderer.ts:91
  experimental

    Scale the render scale for both the canvas and the SDF memoization based on the current and historical FPS values.

  #### Parameters

  - ##### deltaTime: DOMHighResTimeStamp

    since the last frame, in milliseconds.

  #### Returns void

### destroy

- destroy(): void

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

  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

### displayToWorldCoordinates

- displayToWorldCoordinates(displayCoordinates: vec2): vec2

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

  Return the world coordinates from a pixel's position.

  The view area coordinates are also given in world coordinates.

  Useful for picking.

  #### Parameters

  - ##### displayCoordinates: vec2

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

  #### Returns vec2

### renderDrawables

- renderDrawables(): void

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

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

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

  #### Returns void

### setRuntimeSettings

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

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

  Patch the current runtime settings with new values.

  #### Parameters

  - ##### overrides: Partial< RuntimeSettings >

  #### Returns void

### setViewArea

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

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

  Set the camera transformation.

  #### Parameters

  - ##### topLeft: vec2

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

  - ##### size: vec2

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

  #### Returns void