Skip to content

RendererPlugin

Defined in: renderer/src/RendererPlugin.ts:53

RendererPlugin wraps PixiJS v8 behind the YAGE plugin interface.

  • Plugin

new RendererPlugin(config): RendererPlugin

Defined in: renderer/src/RendererPlugin.ts:123

RendererConfig

RendererPlugin

fx: EffectsHost

Defined in: renderer/src/RendererPlugin.ts:103

Screen-scope effects host — .fx.addEffect(...) attaches a filter to app.stage, so it persists across scene transitions and composites everything the renderer draws (every scene, every layer). Common use: screen-wide post-process like vignette or chromatic aberration.

The handle survives scene changes; remove it explicitly when no longer wanted, or it lives until the renderer plugin is destroyed.


readonly name: "renderer" = "renderer"

Defined in: renderer/src/RendererPlugin.ts:54

Unique plugin name.

Plugin.name


readonly version: "4.0.0" = "4.0.0"

Defined in: renderer/src/RendererPlugin.ts:55

Semantic version string.

Plugin.version

get application(): Application

Defined in: renderer/src/RendererPlugin.ts:404

The PixiJS Application instance.

Application


get canvas(): HTMLCanvasElement

Defined in: renderer/src/RendererPlugin.ts:409

The canvas element.

HTMLCanvasElement


get canvasSize(): object

Defined in: renderer/src/RendererPlugin.ts:432

Current canvas size in CSS pixels. Changes on host resize under responsive fit.

object

height: number

width: number


get croppedVirtualRects(): readonly VirtualRect[]

Defined in: renderer/src/RendererPlugin.ts:526

Rectangles of virtual space that are currently off-screen — the complement of visibleVirtualRect inside virtualSize. Use these for effects that need to reason about cropped regions (e.g. fog-of-war overlays at the visible boundary).

Empty under letterbox / expand / stretch. Under cover, returns 1–2 strips.

readonly VirtualRect[]


get extendedVirtualRects(): readonly VirtualRect[]

Defined in: renderer/src/RendererPlugin.ts:563

Rectangles of the visible canvas OUTSIDE the declared virtual rect — the letterbox/expand “bars” expressed in virtual-space pixels.

Populated under letterbox and expand whenever aspect mismatches; empty under cover and stretch. Under expand these are the play-adjacent strips the game is expected to draw into (fog, parallax, HUD). Under letterbox they describe where the background-color bars land — so bar-customization can layer on top of a letterbox render.

readonly VirtualRect[]


get fit(): RendererFitOptions

Defined in: renderer/src/RendererPlugin.ts:437

Current fit configuration.

RendererFitOptions


get isFullscreen(): boolean

Defined in: renderer/src/RendererPlugin.ts:617

Whether the renderer’s host element is currently the fullscreen element. Reads live from the DOM, so this stays accurate when the user exits fullscreen via Esc or the browser UI.

boolean


get orientation(): OrientationType | null

Defined in: renderer/src/RendererPlugin.ts:629

Current device orientation. Returns null when neither the screen.orientation API nor the legacy window.orientation angle is available — typical of headless tests and very old browsers.

OrientationType | null


get sceneRenderTrees(): SceneRenderTreeProvider

Defined in: renderer/src/RendererPlugin.ts:568

The per-scene render tree provider.

SceneRenderTreeProvider


get virtualCanvasRect(): VirtualRect

Defined in: renderer/src/RendererPlugin.ts:537

Where the declared virtual rectangle sits on the canvas, in CSS pixels. Use for DOM overlays positioned over the play area, cropping screenshots to gameplay, or mapping CSS-coord hit regions. The rect may extend past the canvas (negative coords, dimensions larger than canvasSize) under cover.

VirtualRect


get virtualSize(): object

Defined in: renderer/src/RendererPlugin.ts:427

Virtual resolution size.

object

height: number

width: number


get visibleCanvasRect(): VirtualRect

Defined in: renderer/src/RendererPlugin.ts:549

Full canvas extent expressed in virtual-space pixels — unlike visibleVirtualRect, not clamped to the declared virtual rect. Under letterbox / expand on an off-aspect host this extends past virtualSize on the unscaled axis (useful for drawing backdrops that fill the bars). Under cover it equals visibleVirtualRect; under stretch it equals the virtual rect.

VirtualRect


get visibleVirtualRect(): VirtualRect

Defined in: renderer/src/RendererPlugin.ts:514

Sub-rectangle of the declared virtual space that is actually on-screen. Use this to anchor HUD / UI that must stay inside the play area; use visibleCanvasRect if your HUD is allowed to live in the bars. Gameplay queries should stay on virtualSize.

Under letterbox / expand / stretch this equals the full virtual rect. Under cover the long axis is cropped by the canvas edges.

VirtualRect


get worldRoot(): Container

Defined in: renderer/src/RendererPlugin.ts:422

The container that carries the responsive-fit transform — the natural parent for things that should live inside the virtual play area (transition overlays scoped to the play rect, world-space HUD, etc.). Children operate in virtual-space pixels.

Use app.stage instead when the geometry must cover the canvas including letterbox / expand bars (full-screen dip-to-color overlays).

Container

canvasToVirtual(x, y): Vec2

Defined in: renderer/src/RendererPlugin.ts:454

Convert CSS pixels relative to the canvas top-left into virtual-space pixels. Inverts the stage transform currently applied by the fit controller.

number

number

Vec2


createTexture(draw): TextureResource

Defined in: renderer/src/RendererPlugin.ts:573

Create a texture by drawing into a temporary graphics context.

(graphics) => void

TextureResource


exitFullscreen(): Promise<void>

Defined in: renderer/src/RendererPlugin.ts:606

Exit fullscreen. No-op if the page isn’t currently fullscreen.

Promise<void>


hitTestUI(x, y): boolean

Defined in: renderer/src/RendererPlugin.ts:481

Hit-test at virtual-space (x, y) and return true when the topmost interactive Pixi container has any ancestor (including itself) marked via markPointerConsumeContainer. Used by @yagejs/input’s drain step to auto-claim presses landing on UI surfaces.

Coordinates are supplied in virtual space (matching how the input plugin stores pointer positions); they are converted to canvas space via FitController.virtualToCanvas before being forwarded to EventBoundary.hitTest, which per the Pixi v8 spec expects canvas- relative (“world space above the boundary”) coordinates. At fit ratio 1 the two spaces coincide; at any other ratio (mobile / responsive) the conversion is required for the hit-test to land on the correct surface.

number

number

boolean


install(context): Promise<void>

Defined in: renderer/src/RendererPlugin.ts:129

Install services into the engine context. Called in topological order.

EngineContext

Promise<void>

Plugin.install


onDestroy(): void

Defined in: renderer/src/RendererPlugin.ts:364

Called when the engine is destroyed.

void

Plugin.onDestroy


onStart(): Promise<void>

Defined in: renderer/src/RendererPlugin.ts:318

Called after all plugins are installed and the engine has started.

Promise<void>

Plugin.onStart


registerSystems(scheduler): void

Defined in: renderer/src/RendererPlugin.ts:360

Register systems with the scheduler. Called after install.

SystemScheduler

void

Plugin.registerSystems


requestFullscreen(): Promise<void>

Defined in: renderer/src/RendererPlugin.ts:595

Request fullscreen for the renderer’s host element. Targets the configured container when present (so DOM overlays placed alongside the canvas remain inside the fullscreened area), falling back to the canvas itself otherwise. Wraps Element.requestFullscreen with the legacy webkitRequestFullscreen fallback for iOS Safari.

Must be called from a user-gesture handler (click, touch, key); browsers reject the returned Promise with a TypeError otherwise.

Promise<void>


setFit(options): void

Defined in: renderer/src/RendererPlugin.ts:446

Change the fit mode and/or target at runtime.

RendererFitOptions

void


virtualToCanvas(x, y): Vec2

Defined in: renderer/src/RendererPlugin.ts:463

Virtual-space pixels → CSS pixels relative to the canvas top-left. Symmetric with canvasToVirtual; useful when mapping virtual coordinates back out to DOM overlays or pointer regions.

number

number

Vec2