RendererPlugin
Defined in: renderer/src/RendererPlugin.ts:98
RendererPlugin wraps PixiJS v8 behind the YAGE plugin interface.
Implements
Section titled “Implements”PluginRendererAdapter
Constructors
Section titled “Constructors”Constructor
Section titled “Constructor”new RendererPlugin(
config):RendererPlugin
Defined in: renderer/src/RendererPlugin.ts:178
Parameters
Section titled “Parameters”config
Section titled “config”Returns
Section titled “Returns”RendererPlugin
Properties
Section titled “Properties”drawingEnabled
Section titled “drawingEnabled”drawingEnabled:
boolean=true
Defined in: renderer/src/RendererPlugin.ts:101
Whether automatic canvas and render-target drawing is enabled.
fx:
EffectsHost
Defined in: renderer/src/RendererPlugin.ts:156
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.
readonlyname:"renderer"="renderer"
Defined in: renderer/src/RendererPlugin.ts:99
Unique plugin name.
Implementation of
Section titled “Implementation of”Plugin.name
version
Section titled “version”
readonlyversion:"4.0.0"="4.0.0"
Defined in: renderer/src/RendererPlugin.ts:102
Semantic version string.
Implementation of
Section titled “Implementation of”Plugin.version
Accessors
Section titled “Accessors”application
Section titled “application”Get Signature
Section titled “Get Signature”get application():
Application
Defined in: renderer/src/RendererPlugin.ts:465
The PixiJS Application instance.
Returns
Section titled “Returns”canvas
Section titled “canvas”Get Signature
Section titled “Get Signature”get canvas():
HTMLCanvasElement
Defined in: renderer/src/RendererPlugin.ts:470
The canvas element.
Returns
Section titled “Returns”HTMLCanvasElement
Implementation of
Section titled “Implementation of”RendererAdapter.canvas
canvasSize
Section titled “canvasSize”Get Signature
Section titled “Get Signature”get canvasSize():
object
Defined in: renderer/src/RendererPlugin.ts:493
Current canvas size in CSS pixels. Changes on host resize under responsive fit.
Returns
Section titled “Returns”object
height
Section titled “height”height:
number
width:
number
croppedVirtualRects
Section titled “croppedVirtualRects”Get Signature
Section titled “Get Signature”get croppedVirtualRects(): readonly
VirtualRect[]
Defined in: renderer/src/RendererPlugin.ts:688
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.
Returns
Section titled “Returns”readonly VirtualRect[]
extendedVirtualRects
Section titled “extendedVirtualRects”Get Signature
Section titled “Get Signature”get extendedVirtualRects(): readonly
VirtualRect[]
Defined in: renderer/src/RendererPlugin.ts:730
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 only report where the background-color bars land.
Every scene layer is clipped to the virtual rect under that mode, so
content placed at these coordinates on a scene layer is invisible. To
draw in the bars, parent a container directly on renderer.application.stage and
position it in canvas pixels.
Returns
Section titled “Returns”readonly VirtualRect[]
Get Signature
Section titled “Get Signature”get fit():
RendererFitOptions
Defined in: renderer/src/RendererPlugin.ts:498
Current fit configuration.
Returns
Section titled “Returns”isFullscreen
Section titled “isFullscreen”Get Signature
Section titled “Get Signature”get isFullscreen():
boolean
Defined in: renderer/src/RendererPlugin.ts:860
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.
Returns
Section titled “Returns”boolean
orientation
Section titled “orientation”Get Signature
Section titled “Get Signature”get orientation():
OrientationType|null
Defined in: renderer/src/RendererPlugin.ts:872
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.
Returns
Section titled “Returns”OrientationType | null
sceneRenderTrees
Section titled “sceneRenderTrees”Get Signature
Section titled “Get Signature”get sceneRenderTrees():
SceneRenderTreeProvider
Defined in: renderer/src/RendererPlugin.ts:735
The per-scene render tree provider.
Returns
Section titled “Returns”virtualCanvasRect
Section titled “virtualCanvasRect”Get Signature
Section titled “Get Signature”get virtualCanvasRect():
VirtualRect
Defined in: renderer/src/RendererPlugin.ts:699
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.
Returns
Section titled “Returns”virtualSize
Section titled “virtualSize”Get Signature
Section titled “Get Signature”get virtualSize():
object
Defined in: renderer/src/RendererPlugin.ts:488
Virtual resolution size.
Returns
Section titled “Returns”object
height
Section titled “height”height:
number
width:
number
visibleCanvasRect
Section titled “visibleCanvasRect”Get Signature
Section titled “Get Signature”get visibleCanvasRect():
VirtualRect
Defined in: renderer/src/RendererPlugin.ts:711
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.
Returns
Section titled “Returns”visibleVirtualRect
Section titled “visibleVirtualRect”Get Signature
Section titled “Get Signature”get visibleVirtualRect():
VirtualRect
Defined in: renderer/src/RendererPlugin.ts:676
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.
Returns
Section titled “Returns”Implementation of
Section titled “Implementation of”RendererAdapter.visibleVirtualRect
worldRoot
Section titled “worldRoot”Get Signature
Section titled “Get Signature”get worldRoot():
DisplayContainer
Defined in: renderer/src/RendererPlugin.ts:483
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).
Returns
Section titled “Returns”Methods
Section titled “Methods”canvasToVirtual()
Section titled “canvasToVirtual()”canvasToVirtual(
x,y):Vec2
Defined in: renderer/src/RendererPlugin.ts:524
Convert CSS pixels relative to the canvas top-left into virtual-space pixels. Inverts the stage transform currently applied by the fit controller.
Parameters
Section titled “Parameters”number
number
Returns
Section titled “Returns”Vec2
Implementation of
Section titled “Implementation of”RendererAdapter.canvasToVirtual
captureCanvas()
Section titled “captureCanvas()”captureCanvas():
HTMLCanvasElement
Defined in: renderer/src/RendererPlugin.ts:814
Capture the current stage and pending targets without advancing time.
Returns
Section titled “Returns”HTMLCanvasElement
createRenderTarget()
Section titled “createRenderTarget()”createRenderTarget(
source,options):RenderTargetHandle
Defined in: renderer/src/RendererPlugin.ts:792
Create an offscreen buffer that draws source into a texture the game
owns and redraws on its own schedule — the repeatable counterpart of
createTexture, with control over when the buffer refreshes and
how many texels it gets.
Composite the result by showing target.texture (a SpriteComponent, a
mask, a filter input). See RenderTargetHandle for the coordinate
space the source is drawn in and the reasons to keep it out of the live
scene graph.
Parameters
Section titled “Parameters”source
Section titled “source”options
Section titled “options”Returns
Section titled “Returns”createTexture()
Section titled “createTexture()”createTexture(
draw,size?):TextureResource
Defined in: renderer/src/RendererPlugin.ts:755
Bake a texture once by drawing into a temporary graphics context. The result never changes again; for a buffer the game redraws, use createRenderTarget.
With size, the texture measures exactly that region of the drawing,
starting at (0, 0): a 4-frame strip of 32-pixel cells is width: 128, height: 32 however much of each cell the drawing covers. Without it the
texture is the drawn bounds, so its top-left corner is the first pixel
drawn rather than (0, 0), and a drawing that starts at (10, 4) bakes
shifted by that much.
The pixels live only on the GPU, with no image to reload from. Calling
update() on the returned texture’s source re-uploads it empty and
everything drawn from it turns transparent.
Parameters
Section titled “Parameters”(graphics) => void
Returns
Section titled “Returns”dispatchPointerEvent()
Section titled “dispatchPointerEvent()”dispatchPointerEvent(
type,point,button?):void
Defined in: renderer/src/RendererPlugin.ts:633
Deliver a pointer event at virtual-space point, so Pixi hit-tests and
delivers it the way it does for a person clicking: a @yagejs/ui button
runs its onClick, and stacking order, a disabled button’s pointer mode
and clipping all apply. button is the mouse button a press or a release
carries; a move omits it and reports whichever buttons a press left held.
The event goes to the canvas, never to the window: Pixi renames a
pointer-up whose composed path starts elsewhere to pointerupoutside,
which skips a button’s click path. It bubbles, because @yagejs/input
listens for pointer-up on the window in the bubble phase — so the engine
receives the same event and applies it at the next drain, one frame after
the handler has already run.
One primary mouse pointer, id SYNTHETIC_POINTER_ID. Multi-touch is not reachable this way.
Parameters
Section titled “Parameters”RendererPointerEventType
number
number
button?
Section titled “button?”0 | 2 | 1
Returns
Section titled “Returns”void
Implementation of
Section titled “Implementation of”RendererAdapter.dispatchPointerEvent
exitFullscreen()
Section titled “exitFullscreen()”exitFullscreen():
Promise<void>
Defined in: renderer/src/RendererPlugin.ts:849
Exit fullscreen. No-op if the page isn’t currently fullscreen.
Returns
Section titled “Returns”Promise<void>
hasRenderedFrame()
Section titled “hasRenderedFrame()”hasRenderedFrame():
boolean
Defined in: renderer/src/RendererPlugin.ts:612
Whether a frame has been drawn. Pixi roots its event boundary at the last object rendered and drops an event silently when there is none, so a pointer dispatched before the first frame reaches nothing.
Returns
Section titled “Returns”boolean
hitTestUI()
Section titled “hitTestUI()”hitTestUI(
x,y):boolean
Defined in: renderer/src/RendererPlugin.ts:560
Hit-test at virtual-space (x, y) and return true when the topmost
interactive Pixi container resolves to a consuming policy. The nearest
explicit boolean wins; UI without an explicit ancestor defaults to true.
The input drain uses this to claim presses landing on UI surfaces.
Scope: this only sees surfaces marked via markPointerConsumeContainer —
@yagejs/ui primitives (UIPanel, UIButton, …) plus any visual
component (Sprite, AnimatedSprite, Graphics, Text, SplitText)
configured with interactive: { consumeOnInteraction: true }. A plain
sprite is not a consume surface. UI drawn on raw Pixi containers outside
those paths — such as the @yagejs-addons/dialogue box, which never
marks its containers — is not detected. Dialogue-aware callers should
gate on DialogueController.isActive() / isChoosing() instead.
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.
Parameters
Section titled “Parameters”number
number
Returns
Section titled “Returns”boolean
Implementation of
Section titled “Implementation of”RendererAdapter.hitTestUI
hitTestUIPath()
Section titled “hitTestUIPath()”hitTestUIPath(
x,y):RendererUIHit|null
Defined in: renderer/src/RendererPlugin.ts:575
The hit test behind hitTestUI, reporting what it found: the
topmost interactive container and its ancestors, innermost first, plus
their resolved consumption policy. null when nothing
interactive sits under (x, y).
Callers that address a container — matching it against an Inspector
user-interface snapshot, for one — need the chain rather than the
boolean. Same coordinate contract as hitTestUI: (x, y) is in
virtual space.
Parameters
Section titled “Parameters”number
number
Returns
Section titled “Returns”RendererUIHit | null
Implementation of
Section titled “Implementation of”RendererAdapter.hitTestUIPath
install()
Section titled “install()”install(
context):Promise<void>
Defined in: renderer/src/RendererPlugin.ts:184
Install services into the engine context. Called in topological order.
Parameters
Section titled “Parameters”context
Section titled “context”EngineContext
Returns
Section titled “Returns”Promise<void>
Implementation of
Section titled “Implementation of”Plugin.install
onDestroy()
Section titled “onDestroy()”onDestroy():
void
Defined in: renderer/src/RendererPlugin.ts:418
Called when the engine is destroyed.
Returns
Section titled “Returns”void
Implementation of
Section titled “Implementation of”Plugin.onDestroy
onStart()
Section titled “onStart()”onStart():
void
Defined in: renderer/src/RendererPlugin.ts:403
Called after all plugins are installed and the engine has started.
Returns
Section titled “Returns”void
Implementation of
Section titled “Implementation of”Plugin.onStart
registerSystems()
Section titled “registerSystems()”registerSystems(
scheduler):void
Defined in: renderer/src/RendererPlugin.ts:399
Register systems with the scheduler. Called after install.
Parameters
Section titled “Parameters”scheduler
Section titled “scheduler”SystemScheduler
Returns
Section titled “Returns”void
Implementation of
Section titled “Implementation of”Plugin.registerSystems
render()
Section titled “render()”render():
void
Defined in: renderer/src/RendererPlugin.ts:803
Draw the current stage and pending targets without advancing time.
Returns
Section titled “Returns”void
requestFullscreen()
Section titled “requestFullscreen()”requestFullscreen():
Promise<void>
Defined in: renderer/src/RendererPlugin.ts:838
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.
Returns
Section titled “Returns”Promise<void>
setFit()
Section titled “setFit()”setFit(
options):void
Defined in: renderer/src/RendererPlugin.ts:511
Change the fit mode and/or target at runtime. Omitting target keeps the
element the fit currently observes, so switching mode alone does not send
the fit back to its default host.
Parameters
Section titled “Parameters”options
Section titled “options”Returns
Section titled “Returns”void
virtualToCanvas()
Section titled “virtualToCanvas()”virtualToCanvas(
x,y):Vec2
Defined in: renderer/src/RendererPlugin.ts:533
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.
Parameters
Section titled “Parameters”number
number
Returns
Section titled “Returns”Vec2
Coding agents: fetch https://yage.dev/llms.txt first and prefer the Markdown references it links over these HTML pages. This page's Markdown counterpart is /llms/packages/renderer.md.