You are browsing legacy Phaser documentation that is 4+ years out of date. Please see https://newdocs.phaser.io

Class: WebGLRenderer

Phaser.Renderer.WebGL. WebGLRenderer

WebGLRenderer is a class that contains the needed functionality to keep the WebGLRenderingContext state clean. The main idea of the WebGLRenderer is to keep track of any context change that happens for WebGL rendering inside of Phaser. This means if raw webgl functions are called outside the WebGLRenderer of the Phaser WebGL rendering ecosystem they might pollute the current WebGLRenderingContext state producing unexpected behavior. It's recommended that WebGL interaction is done through WebGLRenderer and/or WebGLPipeline.

new WebGLRenderer(game)

Parameters:
Name Type Description
game Phaser.Game

The Game instance which owns this WebGL Renderer.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 31)

Extends

Members

<readonly> blankTexture :WebGLTexture

A blank 32x32 transparent texture, as used by the Graphics system where needed. This is set in the boot method.

Type:
  • WebGLTexture
Since: 3.12.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 442)

blendModes :array

An array of blend modes supported by the WebGL Renderer.

This array includes the default blend modes as well as any custom blend modes added through #addBlendMode.

Type:
  • array
Since: 3.0.0
Default Value:
  • []
Source: src/renderer/webgl/WebGLRenderer.js (Line 156)

canvas :HTMLCanvasElement

The canvas which this WebGL Renderer draws to.

Type:
  • HTMLCanvasElement
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 147)

compression :object

Stores the supported WebGL texture compression formats.

Type:
  • object
Since: 3.8.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 419)

config :object

The local configuration settings of this WebGL Renderer.

Type:
  • object
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 72)

contextLost :boolean

This property is set to true if the WebGL context of the renderer is lost.

Type:
  • boolean
Since: 3.0.0
Default Value:
  • false
Source: src/renderer/webgl/WebGLRenderer.js (Line 168)

contextLostHandler :function

The handler to invoke when the context is lost. This should not be changed and is set in the boot method.

Type:
  • function
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 336)

contextRestoredHandler :function

The handler to invoke when the context is restored. This should not be changed and is set in the boot method.

Type:
  • function
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 346)

currentActiveTexture :number

Cached value for the last texture unit that was used.

Type:
  • number
Since: 3.1.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 201)

currentBlendMode :number

Current blend mode in use

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 299)

currentCameraMask :any

Internal property that tracks the currently set camera mask.

Type:
  • any
Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 491)

currentFramebuffer :WebGLFramebuffer

The currently bound framebuffer in use.

Type:
  • WebGLFramebuffer
Since: 3.0.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 270)

currentMask :any

Internal property that tracks the currently set mask.

Type:
  • any
Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 482)

currentProgram :WebGLProgram

Current WebGLProgram in use.

Type:
  • WebGLProgram
Since: 3.0.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 289)

currentScissor :Uint32Array

Stores the current scissor data

Type:
  • Uint32Array
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 318)

currentScissorEnabled :boolean

Indicates if the the scissor state is enabled in WebGLRenderingContext

Type:
  • boolean
Since: 3.0.0
Default Value:
  • false
Source: src/renderer/webgl/WebGLRenderer.js (Line 308)

currentType :string

The type of the Game Object being currently rendered. This can be used by advanced render functions for batching look-ahead.

Type:
  • string
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 510)

<readonly> drawingBufferHeight :number

Cached drawing buffer height to reduce gl calls.

Type:
  • number
Since: 3.11.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 432)

extensions :object

The WebGL Extensions loaded into the current context.

Type:
  • object
Since: 3.0.0
Default Value:
  • {}
Source: src/renderer/webgl/WebGLRenderer.js (Line 399)

fboStack :Array.<WebGLFramebuffer>

A stack into which the frame buffer objects are pushed and popped.

Type:
  • Array.<WebGLFramebuffer>
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 280)

finalType :boolean

Is the Game Object being currently rendered the final one in the list?

Type:
  • boolean
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 540)

game :Phaser.Game

The Game instance which owns this WebGL Renderer.

Type:
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 92)

gl :WebGLRenderingContext

The underlying WebGL context of the renderer.

Type:
  • WebGLRenderingContext
Since: 3.0.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 356)

glFormats :array

Stores the current WebGL component formats for further use.

Type:
  • array
Since: 3.2.0
Default Value:
  • []
Source: src/renderer/webgl/WebGLRenderer.js (Line 409)

glFuncMap :any

Internal gl function mapping for uniform look-up. https://developer.mozilla.org/en-US/docs/Web/API/WebGLRenderingContext/uniform

Type:
  • any
Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 500)

height :number

The height of the canvas being rendered to. This is populated in the onResize event handler.

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 137)

instancedArraysExtension :ANGLE_instanced_arrays

If the browser supports the ANGLE_instanced_arrays extension, this property will hold a reference to the glExtension for it.

Type:
  • ANGLE_instanced_arrays
Since: 3.50.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 377)

isBooted :boolean

Has this renderer fully booted yet?

Type:
  • boolean
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 605)

isTextureClean :boolean

Are the WebGL Textures in their default state?

Used to avoid constant gl binds.

Type:
  • boolean
Since: 3.51.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 584)

maskCount :number

The total number of masks currently stacked.

Type:
  • number
Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 464)

maskStack :Array.<Phaser.Display.Masks.GeometryMask>

The mask stack.

Type:
Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 473)

maxTextures :number

The maximum number of textures the GPU can handle. The minimum under the WebGL1 spec is 8. This is set via the Game Config maxTextures property and should never be changed after boot.

Type:
  • number
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 220)

mipmapFilter :GLenum

The mipmap magFilter to be used when creating textures.

You can specify this as a string in the game config, i.e.:

renderer: { mipmapFilter: 'NEAREST_MIPMAP_LINEAR' }

The 6 options for WebGL1 are, in order from least to most computationally expensive:

NEAREST (for pixel art) LINEAR (the default) NEAREST_MIPMAP_NEAREST LINEAR_MIPMAP_NEAREST NEAREST_MIPMAP_LINEAR LINEAR_MIPMAP_LINEAR

Mipmaps only work with textures that are fully power-of-two in size.

For more details see https://webglfundamentals.org/webgl/lessons/webgl-3d-textures.html

Type:
  • GLenum
Since: 3.21.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 549)

newType :boolean

Is the type of the Game Object being currently rendered different than the type of the object before it in the display list? I.e. it's a 'new' type.

Type:
  • boolean
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 520)

nextTypeMatch :boolean

Does the type of the next Game Object in the display list match that of the object being currently rendered?

Type:
  • boolean
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 530)

<nullable> normalTexture :WebGLTexture

The currently bound normal map texture at texture unit one, if any.

Type:
  • WebGLTexture
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 261)

pipelines :Phaser.Renderer.WebGL.PipelineManager

An instance of the Pipeline Manager class, that handles all WebGL Pipelines.

Use this to manage all of your interactions with pipelines, such as adding, getting, setting and rendering them.

The Pipeline Manager class is created in the init method and then populated with pipelines during the boot method.

Prior to Phaser v3.50.0 this was just a plain JavaScript object, not a class.

Type:
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 110)

projectionHeight :number

The cached height of the Projection matrix.

Type:
  • number
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 643)

projectionMatrix :Phaser.Math.Matrix4

The global game Projection matrix, used by shaders as 'uProjectionMatrix' uniform.

Type:
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 625)

projectionWidth :number

The cached width of the Projection matrix.

Type:
  • number
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 634)

renderTarget :Phaser.Renderer.WebGL.RenderTarget

A Render Target you can use to capture the current state of the Renderer.

A Render Target encapsulates a framebuffer and texture for the WebGL Renderer.

Type:
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 614)

scissorStack :Uint32Array

Stack of scissor data

Type:
  • Uint32Array
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 327)

snapshotState :Phaser.Types.Renderer.Snapshot.SnapshotState

Details about the currently scheduled snapshot.

If a non-null callback is set in this object, a snapshot of the canvas will be taken after the current frame is fully rendered.

Type:
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 178)

startActiveTexture :number

Contains the current starting active texture unit. This value is constantly updated and should be treated as read-only by your code.

Type:
  • number
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 210)

supportedExtensions :Array.<string>

Array of strings that indicate which WebGL extensions are supported by the browser. This is populated in the boot method.

Type:
  • Array.<string>
Since: 3.0.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 366)

tempTextures :array

An array of default temporary WebGL Textures.

This array is populated during the init phase and should never be changed after boot.

Type:
  • array
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 241)

textureFlush :number

The number of times the renderer had to flush this frame, due to running out of texture units.

Type:
  • number
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 575)

textureIndexes :array

An array of the available WebGL texture units, used to populate the uSampler uniforms.

This array is populated during the init phase and should never be changed after boot.

Type:
  • array
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 230)

<nullable> textureZero :WebGLTexture

The currently bound texture at texture unit zero, if any.

Type:
  • WebGLTexture
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 252)

type :number

A constant which allows the renderer to be easily identified as a WebGL Renderer.

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 101)

vaoExtension :OES_vertex_array_object

If the browser supports the OES_vertex_array_object extension, this property will hold a reference to the glExtension for it.

Type:
  • OES_vertex_array_object
Since: 3.50.0
Default Value:
  • null
Source: src/renderer/webgl/WebGLRenderer.js (Line 388)

<readonly> whiteTexture :WebGLTexture

A pure white 4x4 texture, as used by the Graphics system where needed. This is set in the boot method.

Type:
  • WebGLTexture
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 453)

width :number

The width of the canvas being rendered to. This is populated in the onResize event handler.

Type:
  • number
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 127)

Methods

addBlendMode(func, equation)

Creates a new custom blend mode for the renderer.

See https://developer.mozilla.org/en-US/docs/Web/API/WebGL_API/Constants#Blending_modes

Parameters:
Name Type Description
func Array.<GLenum>

An array containing the WebGL functions to use for the source and the destination blending factors, respectively. See the possible constants for WebGLRenderingContext#blendFunc().
equation GLenum

The equation to use for combining the RGB and alpha components of a new pixel with a rendered one. See the possible constants for WebGLRenderingContext#blendEquation().
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1304)
Returns:

The index of the new blend mode, used for referencing it in the future.

Type
number

addListener(event, fn [, context])

Add a listener for a given event.

Parameters:
Name Type Argument Default Description
event string | symbol

The event name.
fn function

The listener function.
context * <optional>
 this

The context to invoke the listener with.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 111)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

beginCapture( [width] [, height])

Binds the WebGL Renderers Render Target, so all drawn content is now redirected to it.

Make sure to call endCapture when you are finished.

Parameters:
Name Type Argument Description
width number <optional>

Optional new width of the Render Target.
height number <optional>

Optional new height of the Render Target.
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 923)

canvasToTexture(srcCanvas [, dstTexture] [, noRepeat] [, flipY])

Creates a new WebGL Texture based on the given Canvas Element.

If the dstTexture parameter is given, the WebGL Texture is updated, rather than created fresh.

Parameters:
Name Type Argument Default Description
srcCanvas HTMLCanvasElement

The Canvas to create the WebGL Texture from
dstTexture WebGLTexture <optional>

The destination WebGL Texture to set.
noRepeat boolean <optional>
 false

Should this canvas be allowed to set REPEAT (such as for Text objects?)
flipY boolean <optional>
 false

Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y?
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2702)
Returns:

The newly created, or updated, WebGL Texture.

Type
WebGLTexture

clearNormalMap()

Clears the texture that was directly bound to texture unit one and increases the start active texture counter.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1530)

clearTextureZero()

Clears the texture that was directly bound to texture unit zero.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1491)

createCanvasTexture(srcCanvas [, noRepeat] [, flipY])

Creates a new WebGL Texture based on the given Canvas Element.

Parameters:
Name Type Argument Default Description
srcCanvas HTMLCanvasElement

The Canvas to create the WebGL Texture from
noRepeat boolean <optional>
 false

Should this canvas be allowed to set REPEAT (such as for Text objects?)
flipY boolean <optional>
 false

Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y?
Since: 3.20.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2732)
Returns:

The newly created WebGL Texture.

Type
WebGLTexture

createFramebuffer(width, height, renderTexture [, addDepthStencilBuffer])

Creates a WebGL Framebuffer object and optionally binds a depth stencil render buffer.

Parameters:
Name Type Argument Default Description
width number

If addDepthStencilBuffer is true, this controls the width of the depth stencil.
height number

If addDepthStencilBuffer is true, this controls the height of the depth stencil.
renderTexture WebGLTexture

The color texture where the color pixels are written.
addDepthStencilBuffer boolean <optional>
 false

Create a Renderbuffer for the depth stencil?
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2008)
Returns:

Raw WebGLFramebuffer

Type
WebGLFramebuffer

createIndexBuffer(initialDataOrSize, bufferUsage)

Wrapper for creating a vertex buffer.

Parameters:
Name Type Description
initialDataOrSize ArrayBuffer

Either ArrayBuffer or an integer indicating the size of the vbo.
bufferUsage number

How the buffer is used. gl.DYNAMIC_DRAW, gl.STATIC_DRAW or gl.STREAM_DRAW.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2138)
Returns:

Raw index buffer

Type
WebGLBuffer

createProgram(vertexShader, fragmentShader)

Creates a WebGLProgram instance based on the given vertex and fragment shader source.

Then compiles, attaches and links the program before returning it.

Parameters:
Name Type Description
vertexShader string

The vertex shader source code as a single string.
fragmentShader string

The fragment shader source code as a single string.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2066)
Returns:

The linked WebGLProgram created from the given shader source.

Type
WebGLProgram

createTexture2D(mipLevel, minFilter, magFilter, wrapT, wrapS, format, pixels, width, height [, pma] [, forceSize] [, flipY])

A wrapper for creating a WebGLTexture. If no pixel data is passed it will create an empty texture.

Parameters:
Name Type Argument Default Description
mipLevel number

Mip level of the texture.
minFilter number

Filtering of the texture.
magFilter number

Filtering of the texture.
wrapT number

Wrapping mode of the texture.
wrapS number

Wrapping mode of the texture.
format number

Which format does the texture use.
pixels object <nullable>

pixel data.
width number

Width of the texture in pixels.
height number

Height of the texture in pixels.
pma boolean <optional>
 true

Does the texture have premultiplied alpha?
forceSize boolean <optional>
 false

If true it will use the width and height passed to this method, regardless of the pixels dimension.
flipY boolean <optional>
 false

Sets the UNPACK_FLIP_Y_WEBGL flag the WebGL Texture uses during upload.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1929)
Returns:

The WebGLTexture that was created.

Type
WebGLTexture

createTextureFromSource(source, width, height, scaleMode)

Creates a texture from an image source. If the source is not valid it creates an empty texture.

Parameters:
Name Type Description
source object

The source of the texture.
width number

The width of the texture.
height number

The height of the texture.
scaleMode number

The scale mode to be used by the texture.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1880)
Returns:

The WebGL Texture that was created, or null if it couldn't be created.

Type
WebGLTexture

createVertexBuffer(initialDataOrSize, bufferUsage)

Wrapper for creating a vertex buffer.

Parameters:
Name Type Description
initialDataOrSize ArrayBuffer

It's either ArrayBuffer or an integer indicating the size of the vbo
bufferUsage number

How the buffer is used. gl.DYNAMIC_DRAW, gl.STATIC_DRAW or gl.STREAM_DRAW
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2115)
Returns:

Raw vertex buffer

Type
WebGLBuffer

createVideoTexture(srcVideo [, noRepeat] [, flipY])

Creates a new WebGL Texture based on the given HTML Video Element.

Parameters:
Name Type Argument Default Description
srcVideo HTMLVideoElement

The Video to create the WebGL Texture from
noRepeat boolean <optional>
 false

Should this canvas be allowed to set REPEAT?
flipY boolean <optional>
 false

Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y?
Since: 3.20.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2818)
Returns:

The newly created WebGL Texture.

Type
WebGLTexture

deleteBuffer(vertexBuffer)

Deletes a WebGLBuffer from the GL instance.

Parameters:
Name Type Description
vertexBuffer WebGLBuffer

The WebGLBuffer to be deleted.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2235)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

deleteFramebuffer(framebuffer)

Deletes a WebGLFramebuffer from the GL instance.

Parameters:
Name Type Description
framebuffer WebGLFramebuffer

The Framebuffer to be deleted.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2188)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

deleteProgram(program)

Deletes a WebGLProgram from the GL instance.

Parameters:
Name Type Description
program WebGLProgram

The shader program to be deleted.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2215)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

deleteTexture(texture [, reset])

Calls GL.deleteTexture on the given WebGLTexture and also optionally resets the currently defined textures.

Parameters:
Name Type Argument Default Description
texture WebGLTexture

The WebGL Texture to be deleted.
reset boolean <optional>
 false

Call the resetTextures method after deleting this texture?
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2161)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

destroy()

Destroy this WebGLRenderer, cleaning up all related resources such as pipelines, native textures, etc.

Since: 3.0.0
Overrides:
Source: src/renderer/webgl/WebGLRenderer.js (Line 2951)

emit(event [, args])

Calls each of the listeners registered for a given event.

Parameters:
Name Type Argument Description
event string | symbol

The event name.
args * <optional>
<repeatable>

Additional arguments that will be passed to the event handler.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 86)
Returns:

true if the event had listeners, else false.

Type
boolean

endCapture()

Unbinds the WebGL Renderers Render Target and returns it, stopping any further content being drawn to it.

If the viewport or scissors were modified during the capture, you should reset them by calling resetViewport and resetScissor accordingly.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 946)
Returns:

A reference to the WebGL Renderer Render Target.

Type
Phaser.Renderer.WebGL.RenderTarget

eventNames()

Return an array listing the events for which the emitter has registered listeners.

Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 55)
Returns:
Type
Array.<(string|symbol)>

flush()

Flushes the current pipeline if the pipeline is bound

Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1092)

getAspectRatio()

Gets the aspect ratio of the WebGLRenderer dimensions.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1001)
Returns:

The aspect ratio of the WebGLRenderer dimensions.

Type
number

getExtension(extensionName)

Loads a WebGL extension

Parameters:
Name Type Description
extensionName string

The name of the extension to load.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1070)
Returns:

WebGL extension if the extension is supported

Type
object

getMaxTextureSize()

Returns the largest texture size (either width or height) that can be created. Note that VRAM may not allow a texture of any given size, it just expresses hardware / driver support for a given size.

Since: 3.8.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2936)
Returns:

The maximum supported texture size.

Type
number

hasActiveStencilMask()

Is there an active stencil mask?

Since: 3.17.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1228)
Returns:

true if there is an active stencil mask, otherwise false.

Type
boolean

hasExtension(extensionName)

Checks if a WebGL extension is supported

Parameters:
Name Type Description
extensionName string

Name of the WebGL extension
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1055)
Returns:

true if the extension is supported, otherwise false.

Type
boolean

init(config)

Creates a new WebGLRenderingContext and initializes all internal state.

Parameters:
Name Type Description
config object

The configuration object for the renderer.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 655)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

isNewNormalMap(texture, normalMap)

Checks to see if the given diffuse and normal map textures are already bound, or not.

Parameters:
Name Type Description
texture WebGLTexture

The WebGL diffuse texture.
normalMap WebGLTexture

The WebGL normal map texture.
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1446)
Returns:

Returns false if this combination is already set, or true if it's a new combination.

Type
boolean

listenerCount(event)

Return the number of listeners listening to a given event.

Parameters:
Name Type Description
event string | symbol

The event name.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 75)
Returns:

The number of listeners.

Type
number

listeners(event)

Return the listeners registered for a given event.

Parameters:
Name Type Description
event string | symbol

The event name.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 64)
Returns:

The registered listeners.

Type
Array.<function()>

off(event [, fn] [, context] [, once])

Remove the listeners of a given event.

Parameters:
Name Type Argument Description
event string | symbol

The event name.
fn function <optional>

Only remove the listeners that match this function.
context * <optional>

Only remove the listeners that have this context.
once boolean <optional>

Only remove one-time listeners.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 151)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

on(event, fn [, context])

Add a listener for a given event.

Parameters:
Name Type Argument Default Description
event string | symbol

The event name.
fn function

The listener function.
context * <optional>
 this

The context to invoke the listener with.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 98)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

once(event, fn [, context])

Add a one-time listener for a given event.

Parameters:
Name Type Argument Default Description
event string | symbol

The event name.
fn function

The listener function.
context * <optional>
 this

The context to invoke the listener with.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 124)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

onResize(gameSize, baseSize)

The event handler that manages the resize event dispatched by the Scale Manager.

Parameters:
Name Type Description
gameSize Phaser.Structs.Size

The default Game Size object. This is the un-modified game dimensions.
baseSize Phaser.Structs.Size

The base Size object. The game dimensions. The canvas width / height values match this.
Since: 3.16.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 905)

popFramebuffer( [updateScissor] [, resetTextures] [, setViewport])

Pops the previous framebuffer from the fbo stack and sets it.

Parameters:
Name Type Argument Default Description
updateScissor boolean <optional>
 false

If a framebuffer is given, set the gl scissor to match the frame buffer size? Or, if null given, pop the scissor from the stack.
resetTextures boolean <optional>
 false

Should the WebGL Textures be reset after the new framebuffer is bound?
setViewport boolean <optional>
 true

Should the WebGL viewport be set?
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1797)
Returns:

The Framebuffer that was set, or null if there aren't any more in the stack.

Type
WebGLFramebuffer

popScissor()

Pops the last scissor state and sets it.

Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1204)

postRender()

The post-render step happens after all Cameras in all Scenes have been rendered.

Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2513)
Fires:

postRenderCamera(camera)

Controls the post-render operations for the given camera.

Renders the foreground camera effects like flash and fading, then resets the current scissor state.

Parameters:
Name Type Description
camera Phaser.Cameras.Scene2D.Camera

The Camera to post-render.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2321)

preRender()

Clears the current vertex buffer and updates pipelines.

Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2360)
Fires:

preRenderCamera(camera)

Controls the pre-render operations for the given camera. Handles any clipping needed by the camera and renders the background color if a color is visible.

Parameters:
Name Type Description
camera Phaser.Cameras.Scene2D.Camera

The Camera to pre-render.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2252)

pushFramebuffer(framebuffer [, updateScissor] [, resetTextures] [, setViewport])

Pushes a new framebuffer onto the FBO stack and makes it the currently bound framebuffer.

If there was another framebuffer already bound it will force a pipeline flush.

Call popFramebuffer to remove it again.

Parameters:
Name Type Argument Default Description
framebuffer WebGLFramebuffer

The framebuffer that needs to be bound.
updateScissor boolean <optional>
 false

Set the gl scissor to match the frame buffer size? Or, if null given, pop the scissor from the stack.
resetTextures boolean <optional>
 false

Should the WebGL Textures be reset after the new framebuffer is bound?
setViewport boolean <optional>
 true

Should the WebGL viewport be set?
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1692)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

pushScissor(x, y, width, height [, drawingBufferHeight])

Pushes a new scissor state. This is used to set nested scissor states.

Parameters:
Name Type Argument Description
x number

The x position of the scissor.
y number

The y position of the scissor.
width number

The width of the scissor.
height number

The height of the scissor.
drawingBufferHeight number <optional>

Optional drawingBufferHeight override value.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1103)
Returns:

An array containing the scissor values.

Type
Array.<number>

removeAllListeners( [event])

Remove all listeners, or those of the specified event.

Parameters:
Name Type Argument Description
event string | symbol <optional>

The event name.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 165)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

removeBlendMode(index)

Removes a custom blend mode from the renderer. Any Game Objects still using this blend mode will error, so be sure to clear them first.

Parameters:
Name Type Description
index number

The index of the custom blend mode to be removed.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1351)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

removeListener(event [, fn] [, context] [, once])

Remove the listeners of a given event.

Parameters:
Name Type Argument Description
event string | symbol

The event name.
fn function <optional>

Only remove the listeners that match this function.
context * <optional>

Only remove the listeners that have this context.
once boolean <optional>

Only remove one-time listeners.
Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 137)
Returns:

this.

Type
Phaser.Renderer.WebGL.WebGLRenderer

render(scene, children, camera)

The core render step for a Scene Camera.

Iterates through the given array of Game Objects and renders them with the given Camera.

This is called by the CameraManager.render method. The Camera Manager instance belongs to a Scene, and is invoked by the Scene Systems.render method.

This method is not called if Camera.visible is false, or Camera.alpha is zero.

Parameters:
Name Type Description
scene Phaser.Scene

The Scene to render.
children Array.<Phaser.GameObjects.GameObject>

An array of filtered Game Objects that can be rendered by the given Camera.
camera Phaser.Cameras.Scene2D.Camera

The Scene Camera to render with.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2406)
Fires:

resetProgram()

Rebinds whatever program WebGLRenderer.currentProgram is set as, without changing anything, or flushing.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1864)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

resetProjectionMatrix()

Resets the Projection Matrix back to this renderers width and height.

This is called during endCapture, should the matrix have been changed as a result of the capture process.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1038)

resetScissor()

Resets the gl scissor state to be whatever the current scissor is, if there is one, without modifying the scissor stack.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1175)

resetTextures( [all])

Flushes the current pipeline, then resets the first two textures back to the default temporary textures, resets the start active counter and sets texture unit 1 as being active.

Parameters:
Name Type Argument Default Description
all boolean <optional>
 false

Reset all textures, or just the first two?
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1574)

resetViewport()

Resets the gl viewport to the current renderer dimensions.

Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1244)

resize( [width] [, height])

Resizes the drawing buffer to match that required by the Scale Manager.

Parameters:
Name Type Argument Description
width number <optional>

The new width of the renderer.
height number <optional>

The new height of the renderer.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 966)
Fires:
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

setBlendMode(blendModeId [, force])

Sets the blend mode to the value given.

If the current blend mode is different from the one given, the pipeline is flushed and the new blend mode is enabled.

Parameters:
Name Type Argument Default Description
blendModeId number

The blend mode to be set. Can be a BlendModes const or an integer value.
force boolean <optional>
 false

Force the blend mode to be set, regardless of the currently set blend mode.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1259)
Returns:

true if the blend mode was changed as a result of this call, forcing a flush, otherwise false.

Type
boolean

setFramebuffer(framebuffer [, updateScissor] [, resetTextures] [, setViewport])

Sets the given framebuffer as the active and currently bound framebuffer.

If there was another framebuffer already bound it will force a pipeline flush.

Typically, you should call pushFramebuffer instead of this method.

Parameters:
Name Type Argument Default Description
framebuffer WebGLFramebuffer

The framebuffer that needs to be bound.
updateScissor boolean <optional>
 false

If a framebuffer is given, set the gl scissor to match the frame buffer size? Or, if null given, pop the scissor from the stack.
resetTextures boolean <optional>
 false

Should the WebGL Textures be reset after the new framebuffer is bound?
setViewport boolean <optional>
 true

Should the WebGL viewport be set?
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1721)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

setNormalMap(texture)

Binds a texture directly to texture unit one then activates it. If the texture is already at unit one, it skips the bind. Make sure to call clearNormalMap after using this method.

Parameters:
Name Type Description
texture WebGLTexture

The WebGL texture that needs to be bound.
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1502)

setProgram(program)

Binds a shader program.

If there was a different program already bound it will force a pipeline flush first.

If the same program given to this method is already set as the current program, no change will take place and this method will return false.

Parameters:
Name Type Description
program WebGLProgram

The program that needs to be bound.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1833)
Returns:

true if the given program was bound, otherwise false.

Type
boolean

setProjectionMatrix(width, height)

Sets the Projection Matrix of this renderer to the given dimensions.

Parameters:
Name Type Description
width number

The new width of the Projection Matrix.
height number

The new height of the Projection Matrix.
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1014)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

setScissor(x, y, width, height [, drawingBufferHeight])

Sets the current scissor state.

Parameters:
Name Type Argument Description
x number

The x position of the scissor.
y number

The y position of the scissor.
width number

The width of the scissor.
height number

The height of the scissor.
drawingBufferHeight number <optional>

Optional drawingBufferHeight override value.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1134)

setTexture2D(texture)

Binds a texture at a texture unit. If a texture is already bound to that unit it will force a flush on the current pipeline.

Parameters:
Name Type Description
texture WebGLTexture

The WebGL texture that needs to be bound.
Version:
  • 2.0 - Updated in 3.50.0 to remove the `textureUnit` and `flush` parameters.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1630)
Returns:

The texture unit that was assigned to the Texture Source.

Type
number

setTextureFilter(texture, filter)

Sets the minification and magnification filter for a texture.

Parameters:
Name Type Description
texture number

The texture to set the filter for.
filter number

The filter to set. 0 for linear filtering, 1 for nearest neighbor (blocky) filtering.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2903)
Returns:

This WebGL Renderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

setTextureSource(textureSource)

Activates the Texture Source and assigns it the next available texture unit. If none are available, it will flush the current pipeline first.

Parameters:
Name Type Description
textureSource Phaser.Textures.TextureSource

The Texture Source to be assigned the texture unit.
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1385)
Returns:

The texture unit that was assigned to the Texture Source.

Type
number

setTextureZero(texture [, flush])

Binds a texture directly to texture unit zero then activates it. If the texture is already at unit zero, it skips the bind. Make sure to call clearTextureZero after using this method.

Parameters:
Name Type Argument Default Description
texture WebGLTexture

The WebGL texture that needs to be bound.
flush boolean <optional>
 false

Flush the pipeline if the texture is different?
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1462)

shutdown()

Removes all listeners.

Since: 3.0.0
Inherited From:
Source: src/events/EventEmitter.js (Line 31)

snapshot(callback [, type] [, encoderOptions])

Schedules a snapshot of the entire game viewport to be taken after the current frame is rendered.

To capture a specific area see the snapshotArea method. To capture a specific pixel, see snapshotPixel.

Only one snapshot can be active per frame. If you have already called snapshotPixel, for example, then calling this method will override it.

Snapshots work by using the WebGL readPixels feature to grab every pixel from the frame buffer into an ArrayBufferView. It then parses this, copying the contents to a temporary Canvas and finally creating an Image object from it, which is the image returned to the callback provided. All in all, this is a computationally expensive and blocking process, which gets more expensive the larger the canvas size gets, so please be careful how you employ this in your game.

Parameters:
Name Type Argument Default Description
callback Phaser.Types.Renderer.Snapshot.SnapshotCallback

The Function to invoke after the snapshot image is created.
type string <optional>
 'image/png'

The format of the image to create, usually image/png or image/jpeg.
encoderOptions number <optional>
 0.92

The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2544)
Returns:

This WebGL Renderer.

Type
Phaser.Renderer.WebGL.WebGLRenderer

snapshotArea(x, y, width, height, callback [, type] [, encoderOptions])

Schedules a snapshot of the given area of the game viewport to be taken after the current frame is rendered.

To capture the whole game viewport see the snapshot method. To capture a specific pixel, see snapshotPixel.

Only one snapshot can be active per frame. If you have already called snapshotPixel, for example, then calling this method will override it.

Snapshots work by using the WebGL readPixels feature to grab every pixel from the frame buffer into an ArrayBufferView. It then parses this, copying the contents to a temporary Canvas and finally creating an Image object from it, which is the image returned to the callback provided. All in all, this is a computationally expensive and blocking process, which gets more expensive the larger the canvas size gets, so please be careful how you employ this in your game.

Parameters:
Name Type Argument Default Description
x number

The x coordinate to grab from.
y number

The y coordinate to grab from.
width number

The width of the area to grab.
height number

The height of the area to grab.
callback Phaser.Types.Renderer.Snapshot.SnapshotCallback

The Function to invoke after the snapshot image is created.
type string <optional>
 'image/png'

The format of the image to create, usually image/png or image/jpeg.
encoderOptions number <optional>
 0.92

The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg.
Since: 3.16.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2571)
Returns:

This WebGL Renderer.

Type
Phaser.Renderer.WebGL.WebGLRenderer

snapshotFramebuffer(framebuffer, bufferWidth, bufferHeight, callback [, getPixel] [, x] [, y] [, width] [, height] [, type] [, encoderOptions])

Takes a snapshot of the given area of the given frame buffer.

Unlike the other snapshot methods, this one is processed immediately and doesn't wait for the next render.

Snapshots work by using the WebGL readPixels feature to grab every pixel from the frame buffer into an ArrayBufferView. It then parses this, copying the contents to a temporary Canvas and finally creating an Image object from it, which is the image returned to the callback provided. All in all, this is a computationally expensive and blocking process, which gets more expensive the larger the canvas size gets, so please be careful how you employ this in your game.

Parameters:
Name Type Argument Default Description
framebuffer WebGLFramebuffer

The framebuffer to grab from.
bufferWidth number

The width of the framebuffer.
bufferHeight number

The height of the framebuffer.
callback Phaser.Types.Renderer.Snapshot.SnapshotCallback

The Function to invoke after the snapshot image is created.
getPixel boolean <optional>
 false

Grab a single pixel as a Color object, or an area as an Image object?
x number <optional>
 0

The x coordinate to grab from.
y number <optional>
 0

The y coordinate to grab from.
width number <optional>
 bufferWidth

The width of the area to grab.
height number <optional>
 bufferHeight

The height of the area to grab.
type string <optional>
 'image/png'

The format of the image to create, usually image/png or image/jpeg.
encoderOptions number <optional>
 0.92

The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg.
Since: 3.19.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2643)
Returns:

This WebGL Renderer.

Type
Phaser.Renderer.WebGL.WebGLRenderer

snapshotPixel(x, y, callback)

Schedules a snapshot of the given pixel from the game viewport to be taken after the current frame is rendered.

To capture the whole game viewport see the snapshot method. To capture a specific area, see snapshotArea.

Only one snapshot can be active per frame. If you have already called snapshotArea, for example, then calling this method will override it.

Unlike the other two snapshot methods, this one will return a Color object containing the color data for the requested pixel. It doesn't need to create an internal Canvas or Image object, so is a lot faster to execute, using less memory.

Parameters:
Name Type Description
x number

The x coordinate of the pixel to get.
y number

The y coordinate of the pixel to get.
callback Phaser.Types.Renderer.Snapshot.SnapshotCallback

The Function to invoke after the snapshot pixel data is extracted.
Since: 3.16.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2613)
Returns:

This WebGL Renderer.

Type
Phaser.Renderer.WebGL.WebGLRenderer

unbindTextures( [all])

Activates each texture, in turn, then binds them all to null.

Parameters:
Name Type Argument Default Description
all boolean <optional>
 false

Reset all textures, or just the first two?
Since: 3.50.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1546)

updateBlendMode(index, func, equation)

Updates the function bound to a given custom blend mode.

Parameters:
Name Type Description
index number

The index of the custom blend mode.
func function

The function to use for the blend mode.
equation function

The equation to use for the blend mode.
Since: 3.0.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 1324)
Returns:

This WebGLRenderer instance.

Type
Phaser.Renderer.WebGL.WebGLRenderer

updateCanvasTexture(srcCanvas, dstTexture [, flipY])

Updates a WebGL Texture based on the given Canvas Element.

Parameters:
Name Type Argument Default Description
srcCanvas HTMLCanvasElement

The Canvas to update the WebGL Texture from.
dstTexture WebGLTexture

The destination WebGL Texture to update.
flipY boolean <optional>
 false

Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y?
Since: 3.20.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2774)
Returns:

The updated WebGL Texture.

Type
WebGLTexture

updateVideoTexture(srcVideo, dstTexture [, flipY])

Updates a WebGL Texture based on the given HTML Video Element.

Parameters:
Name Type Argument Default Description
srcVideo HTMLVideoElement

The Video to update the WebGL Texture with.
dstTexture WebGLTexture

The destination WebGL Texture to update.
flipY boolean <optional>
 false

Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y?
Since: 3.20.0
Source: src/renderer/webgl/WebGLRenderer.js (Line 2860)
Returns:

The updated WebGL Texture.

Type
WebGLTexture