phaser - v4.0.0-rc.4
    Preparing search index...

    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 built-in RenderNodes.

    Persistent WebGL objects are stored in "wrappers" which are created by the WebGLRenderer. Wrappers contain WebGL objects and metadata about those objects. This can be used to recreate the WebGL state after a context loss. Prefer to pass references to the wrappers, rather than the raw WebGL objects, as the raw objects may be destroyed or replaced at any time. Extract them only when needed.

    WebGL state, such as blend mode or texture units, is managed by the WebGLRenderer. Use WebGLRenderer.glWrapper to manage the current state rather than setting it directly on the WebGLRenderingContext. The state wrapper will ensure that the state is only set if it has changed, and can restore the state after a context loss or external render call.

    Hierarchy (View Summary)

    Index

    Constructors

    Properties

    Methods

    Constructors

    Properties

    baseDrawingContext: DrawingContext

    The DrawingContext used for the base canvas.

    blankTexture: WebGLTextureWrapper

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

    blendModes: WebGLBlendParameters[]

    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.

    cameraRenderNode: RenderNode

    The RenderNode to use for rendering individual cameras.

    This will be populated during the boot method.

    canvas: HTMLCanvasElement

    The canvas which this WebGL Renderer draws to.

    Stores the WebGL texture compression formats that this device and browser supports.

    Support for using compressed texture formats was added in Phaser version 3.60.

    config: object

    The local configuration settings of this WebGL Renderer.

    contextLost: boolean

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

    contextLostHandler: Function

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

    contextRestoredHandler: Function

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

    currentViewCamera: Cameras.Scene2D.Camera

    The camera currently being rendered by render.

    drawingBufferHeight: number

    Cached drawing buffer height to reduce gl calls.

    drawingContextPool: DrawingContextPool

    A pool of DrawingContexts which can be reused.

    extensions: object

    The WebGL Extensions loaded into the current context.

    game: Game

    The Game instance which owns this WebGL Renderer.

    genericQuadIndexBuffer: WebGLBufferWrapper

    A generic quad index buffer. This is a READ-ONLY buffer. It describes the four corners of a quad, a structure which is used in several places in the renderer.

    gl: WebGLRenderingContext

    The underlying WebGL context of the renderer.

    glBufferWrappers: WebGLBufferWrapper[]

    A list of all WebGLBufferWrappers that have been created by this renderer.

    glFormats: any[]

    Stores the current WebGL component formats for further use.

    This array is populated in the init method.

    glFramebufferWrappers: WebGLFramebufferWrapper[]

    A list of all WebGLFramebufferWrappers that have been created by this renderer.

    glProgramWrappers: WebGLProgramWrapper[]

    A list of all WebGLProgramWrappers that have been created by this renderer.

    glTextureUnits: WebGLTextureUnitsWrapper

    The current WebGL texture units in use.

    glTextureWrappers: WebGLTextureWrapper[]

    A list of all WebGLTextureWrappers that have been created by this renderer.

    glVAOWrappers: WebGLVAOWrapper[]

    A list of all WebGLVAOWrappers that have been created by this renderer.

    The current WebGLRenderingContext state.

    height: number

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

    instancedArraysExtension: ANGLE_instanced_arrays

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

    This is populated in the setExtensions method.

    isBooted: boolean

    Has this renderer fully booted yet?

    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.

    mipmapFilter: number

    The mipmap magFilter to be used when creating textures.

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

    render: { 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

    As of v3.60 no mipmaps will be generated unless a string is given in the game config. This saves on VRAM use when it may not be required. To obtain the previous result set the property to LINEAR in the config.

    normalTexture: WebGLTextureWrapper

    A blank 1x1 #7f7fff texture, a flat normal map, as used by the Graphics system where needed. This is set in the boot method.

    parallelShaderCompileExtension: KHR_parallel_shader_compile

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

    This is populated in the setExtensions method.

    previousContextLostHandler: Function

    The previous contextLostHandler that was in use. This is set when setContextHandlers is called.

    previousContextRestoredHandler: Function

    The previous contextRestoredHandler that was in use. This is set when setContextHandlers is called.

    projectionFlipY: boolean

    The cached flipY state of the Projection matrix.

    This is usually false, preserving WebGL coordinate space.

    projectionHeight: number

    The cached height of the Projection matrix.

    projectionMatrix: Math.Matrix4

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

    projectionWidth: number

    The cached width of the Projection matrix.

    renderNodes: RenderNodeManager

    An instance of the RenderNodeManager class which handles all RenderNodes used by the WebGLRenderer.

    shaderProgramFactory: ShaderProgramFactory

    The shader program factory for managing variant shaders.

    snapshotState: 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.

    spector: Function

    An instance of SpectorJS used for WebGL Debugging.

    Only available in the Phaser Debug build.

    standardDerivativesExtension: OES_standard_derivatives

    If the browser supports the OES_standard_derivatives extension, and the smoothPixelArt config option is true, this property will hold a reference to the glExtension for it.

    This is populated in the setExtensions method.

    supportedExtensions: string[]

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

    textureUnitIndices: number[]

    A list containing the indices of all available texture units. This is populated during the init method. It is used internally to connect texture units to shaders.

    type: number

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

    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.

    This is populated in the setExtensions method.

    whiteTexture: WebGLTextureWrapper

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

    width: number

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

    Methods

    • Parameters

      • func: number[]

        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: number

        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().

      Returns number

    • Add a listener for a given event.

      Parameters

      • event: string | symbol

        The event name.

      • fn: Function

        The listener function.

      • Optionalcontext: any

        The context to invoke the listener with. Default this.

      Returns this

    • 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

      • srcCanvas: HTMLCanvasElement

        The Canvas to create the WebGL Texture from

      • OptionaldstTexture: WebGLTextureWrapper

        The destination WebGLTextureWrapper to set.

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT (such as for Text objects?) Default false.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      Returns WebGLTextureWrapper

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method will capture the current WebGL frame and send it to the Spector.js tool for inspection.

      Parameters

      • OptionalquickCapture: boolean

        If true thumbnails are not captured in order to speed up the capture. Default false.

      • OptionalfullCapture: boolean

        If true all details are captured. Default false.

      Returns void

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method will capture the next WebGL frame and send it to the Spector.js tool for inspection.

      Returns void

    • Clear the current framebuffer to the given color.

      Parameters

      • Optionalcolor: number[]

        The color to clear to. Four values in the range 0.0 - 1.0.

      • Optionalstencil: number

        The stencil value to clear to.

      • Optionaldepth: number

        The depth value to clear to. Currently, this is not set, and only determines whether the depth buffer is cleared.

      Returns void

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

      Parameters

      • srcCanvas: HTMLCanvasElement

        The Canvas to create the WebGL Texture from.

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT (such as for Text objects?) Default false.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      Returns WebGLTextureWrapper

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

      This will unbind any currently bound framebuffer.

      Parameters

      • renderTexture: WebGLTextureWrapper | WebGLTextureWrapper[]

        The color texture where the color pixels are written. Specify an array for multiple color attachments, but WebGL1 only supports the first by default. Specify null to create a framebuffer for the base canvas.

      • OptionaladdStencilBuffer: boolean

        Create a Renderbuffer for the stencil? Default false.

      • OptionaladdDepthBuffer: boolean

        Create a Renderbuffer for the depth? Default false.

      Returns WebGLFramebufferWrapper

    • Wrapper for creating a vertex buffer.

      Parameters

      • 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.

      Returns WebGLBufferWrapper

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

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

      Parameters

      • vertexShader: string

        The vertex shader source code as a single string.

      • fragmentShader: string

        The fragment shader source code as a single string.

      Returns WebGLProgramWrapper

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

      Parameters

      • 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

        pixel data.

      • width: number

        Width of the texture in pixels. If not supplied, it must be derived from pixels.

      • height: number

        Height of the texture in pixels. If not supplied, it must be derived from pixels.

      • Optionalpma: boolean

        Does the texture have premultiplied alpha? Default true.

      • OptionalforceSize: boolean

        If true it will use the width and height passed to this method, regardless of the pixels dimension. Default false.

      • OptionalflipY: boolean

        Sets the UNPACK_FLIP_Y_WEBGL flag the WebGL Texture uses during upload. Default true.

      Returns WebGLTextureWrapper

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

      Parameters

      • 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.

      • OptionalforceClamp: boolean

        Force the texture to use the CLAMP_TO_EDGE wrap mode, even if a power of two? Default false.

      • OptionalflipY: boolean

        Sets the UNPACK_FLIP_Y_WEBGL flag the WebGL Texture uses during upload. Default true.

      Returns WebGLTextureWrapper

    • Create a WebGLTexture from a Uint8Array.

      The Uint8Array is assumed to be RGBA values, one byte per color component.

      The texture will be filtered with gl.NEAREST and will not be mipped.

      Parameters

      • data: Uint8Array

        The Uint8Array to create the texture from.

      • width: number

        The width of the texture.

      • height: number

        The height of the texture.

      • Optionalpma: boolean

        Should the texture be set as having premultiplied alpha? Default true.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      Returns WebGLTextureWrapper

    • Wrapper for creating a vertex buffer.

      Parameters

      • 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

      Returns WebGLBufferWrapper

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

      Parameters

      • srcVideo: HTMLVideoElement

        The Video to create the WebGL Texture from

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT? Default false.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      Returns WebGLTextureWrapper

    • This method is called when the WebGL context is lost. By default this is bound to the property WebGLRenderer.contextLostHandler. If you override the context loss handler via the setContextHandlers method then be sure to invoke this method in due course.

      Parameters

      • event: WebGLContextEvent

        The WebGL context lost Event.

      Returns void

    • This method is called when the WebGL context is restored. By default this is bound to the property WebGLRenderer.contextRestoredHandler. If you override the context restored handler via the setContextHandlers method then be sure to invoke this method in due course.

      Parameters

      • event: WebGLContextEvent

        The WebGL context restored Event.

      Returns void

    • Draw a number of vertices to a drawing context.

      This draws the vertices using an index buffer. The buffer should be bound to the VAO. Vertices are drawn as a TRIANGLE_STRIP by default.

      This is the primary render method. It requires all the WebGL resources necessary to render the vertices, so they don't have to be set up ad-hoc elsewhere.

      It does not upload vertex data to buffers. Ensure that this is done before calling this method.

      Parameters

      • drawingContext: DrawingContext

        The DrawingContext to draw to.

      • textures: WebGLTextureWrapper[]

        An array of textures to bind. Textures are bound to units corresponding to their indices in the array.

      • program: WebGLProgramWrapper

        The shader program to use.

      • vao: WebGLVAOWrapper

        The Vertex Array Object to bind. It must have an index buffer attached.

      • count: number

        The number of vertices to draw. Because of the TRIANGLE_STRIP topology, this should be n + 2, where n is the number of triangles to draw, including degenerate triangles.

      • offset: number

        The offset to start drawing from in the index buffer. This is in bytes, and should be a multiple of 2 (for 16-bit UNSIGNED_SHORT indices).

      • topology: number

        The type of primitives to render. Defaults to TRIANGLE_STRIP.

      Returns void

    • Draw a number of instances to a drawing context.

      This draws vertices using the ANGLE_instanced_arrays extension. This typically uses an instance buffer and a vertex buffer. Both should be bound to the VAO. Vertices are drawn as a TRIANGLE_STRIP by default.

      It does not upload vertex data to buffers. Ensure that this is done before calling this method.

      Parameters

      • drawingContext: DrawingContext

        The DrawingContext to draw to.

      • textures: WebGLTextureWrapper[]

        An array of textures to bind. Textures are bound to units corresponding to their indices in the array.

      • program: WebGLProgramWrapper

        The shader program to use.

      • vao: WebGLVAOWrapper

        The Vertex Array Object to bind. It does not need an index buffer attached.

      • first: number

        The starting index in the array of vector points.

      • count: number

        The number of vertices to draw.

      • instanceCount: number

        The number of instances to render.

      Returns void

    • Calls each of the listeners registered for a given event.

      Parameters

      • event: string | symbol

        The event name.

      • ...args: any[]

        Additional arguments that will be passed to the event handler.

      Returns boolean

    • Gets the aspect ratio of the WebGLRenderer dimensions.

      Returns number

    • Returns a compressed texture format GLenum name based on the given format.

      Parameters

      • baseFormat: string

        The Base Format to check.

      • Optionalformat: number

        An optional GLenum format to check within the base format.

      Returns string

    • Determines which compressed texture formats this browser and device supports.

      Called automatically as part of the WebGL Renderer init process. If you need to investigate which formats it supports, see the Phaser.Renderer.WebGL.WebGLRenderer#compression property instead.

      Returns WebGLTextureCompression

    • Loads a WebGL extension

      Parameters

      • extensionName: string

        The name of the extension to load.

      Returns object

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method will return the current FPS of the WebGL canvas.

      Returns number

    • 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.

      Returns number

    • Checks if a WebGL extension is supported

      Parameters

      • extensionName: string

        Name of the WebGL extension

      Returns boolean

    • Creates a new WebGLRenderingContext and initializes all internal state.

      Parameters

      • config: object

        The configuration object for the renderer.

      Returns this

    • Return the number of listeners listening to a given event.

      Parameters

      • event: string | symbol

        The event name.

      Returns number

    • Return the listeners registered for a given event.

      Parameters

      • event: string | symbol

        The event name.

      Returns Function[]

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method adds a command with the name value in the list. This can be filtered in the search. All logs can be filtered searching for "LOG".

      Parameters

      • ...arguments: any[]

        The arguments to log to Spector.

      Returns string

    • Remove the listeners of a given event.

      Parameters

      • event: string | symbol

        The event name.

      • Optionalfn: Function

        Only remove the listeners that match this function.

      • Optionalcontext: any

        Only remove the listeners that have this context.

      • Optionalonce: boolean

        Only remove one-time listeners.

      Returns this

    • Add a listener for a given event.

      Parameters

      • event: string | symbol

        The event name.

      • fn: Function

        The listener function.

      • Optionalcontext: any

        The context to invoke the listener with. Default this.

      Returns this

    • Add a one-time listener for a given event.

      Parameters

      • event: string | symbol

        The event name.

      • fn: Function

        The listener function.

      • Optionalcontext: any

        The context to invoke the listener with. Default this.

      Returns this

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

      Parameters

      • gameSize: Structs.Size

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

      • baseSize: Structs.Size

        The base Size object. The game dimensions. The canvas width / height values match this.

      Returns void

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

      Returns void

    • Clears the base DrawingContext and readies it for use.

      Returns void

    • 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

      • index: number

        The index of the custom blend mode to be removed.

      Returns this

    • Remove the listeners of a given event.

      Parameters

      • event: string | symbol

        The event name.

      • Optionalfn: Function

        Only remove the listeners that match this function.

      • Optionalcontext: any

        Only remove the listeners that have this context.

      • Optionalonce: boolean

        Only remove one-time listeners.

      Returns this

    • 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

      • scene: Scene

        The Scene to render.

      • children: GameObject[]

        An array of filtered Game Objects that can be rendered by the given Camera.

      • camera: Cameras.Scene2D.Camera

        The Scene Camera to render with.

      Returns void

    • 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.

      Returns this

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

      Parameters

      • Optionalwidth: number

        The new width of the renderer.

      • Optionalheight: number

        The new height of the renderer.

      Returns this

    • Sets the handlers that are called when WebGL context is lost or restored by the browser.

      The default handlers are referenced via the properties WebGLRenderer.contextLostHandler and WebGLRenderer.contextRestoredHandler. By default, these map to the methods WebGLRenderer.dispatchContextLost and WebGLRenderer.dispatchContextRestored.

      You can override these handlers with your own via this method.

      If you do override them, make sure that your handlers invoke the methods WebGLRenderer.dispatchContextLost and WebGLRenderer.dispatchContextRestored in due course, otherwise the renderer will not be able to restore itself fully.

      Parameters

      • OptionalcontextRestored: Function

        Custom handler for responding to the WebGL context restored event. Set as undefined to use the default handler.

      Returns void

    • Queries the GL context to get the supported extensions.

      Then sets them into the supportedExtensions, instancedArraysExtension and vaoExtension properties.

      Called automatically during the init method.

      Returns void

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

      Parameters

      • width: number

        The new width of the Projection Matrix.

      • height: number

        The new height of the Projection Matrix.

      • OptionalflipY: boolean

        Should the Y axis be flipped? Default false.

      Returns this

    • Sets the Projection Matrix of this renderer to match the given drawing context.

      Parameters

      • drawingContext: DrawingContext

        The drawing context to set the projection matrix from.

      Returns this

    • Sets the minification and magnification filter for a texture.

      Parameters

      • texture: WebGLTextureWrapper

        The texture to set the filter for.

      • filter: number

        The filter to set. 0 for linear filtering, 1 for nearest neighbor (blocky) filtering.

      Returns this

    • 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

      • callback: SnapshotCallback

        The Function to invoke after the snapshot image is created.

      • Optionaltype: string

        The format of the image to create, usually image/png or image/jpeg. Default 'image/png'.

      • OptionalencoderOptions: number

        The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg. Default 0.92.

      Returns this

    • 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

      • x: number

        The x coordinate to grab from. This is based on the game viewport, not the world.

      • y: number

        The y coordinate to grab from. This is based on the game viewport, not the world.

      • width: number

        The width of the area to grab.

      • height: number

        The height of the area to grab.

      • callback: SnapshotCallback

        The Function to invoke after the snapshot image is created.

      • Optionaltype: string

        The format of the image to create, usually image/png or image/jpeg. Default 'image/png'.

      • OptionalencoderOptions: number

        The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg. Default 0.92.

      Returns this

    • 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

      • framebuffer: WebGLFramebufferWrapper

        The framebuffer to grab from.

      • bufferWidth: number

        The width of the framebuffer.

      • bufferHeight: number

        The height of the framebuffer.

      • callback: SnapshotCallback

        The Function to invoke after the snapshot image is created.

      • OptionalgetPixel: boolean

        Grab a single pixel as a Color object, or an area as an Image object? Default false.

      • Optionalx: number

        The x coordinate to grab from. This is based on the framebuffer, not the world. Default 0.

      • Optionaly: number

        The y coordinate to grab from. This is based on the framebuffer, not the world. Default 0.

      • Optionalwidth: number

        The width of the area to grab. Default bufferWidth.

      • Optionalheight: number

        The height of the area to grab. Default bufferHeight.

      • Optionaltype: string

        The format of the image to create, usually image/png or image/jpeg. Default 'image/png'.

      • OptionalencoderOptions: number

        The image quality, between 0 and 1. Used for image formats with lossy compression, such as image/jpeg. Default 0.92.

      Returns this

    • 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

      • x: number

        The x coordinate of the pixel to get. This is based on the game viewport, not the world.

      • y: number

        The y coordinate of the pixel to get. This is based on the game viewport, not the world.

      • callback: SnapshotCallback

        The Function to invoke after the snapshot pixel data is extracted.

      Returns this

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method will start a capture on the Phaser canvas. The capture will stop once it reaches the number of commands specified as a parameter, or after 10 seconds. If quick capture is true, the thumbnails are not captured in order to speed up the capture.

      Parameters

      • OptionalcommandCount: number

        The number of commands to capture. If zero it will capture for 10 seconds. Default 0.

      • OptionalquickCapture: boolean

        If true thumbnails are not captured in order to speed up the capture. Default false.

      • OptionalfullCapture: boolean

        If true all details are captured. Default false.

      Returns void

    • This method is only available in the Debug Build of Phaser, or a build with the WEBGL_DEBUG flag set in the Webpack Config.

      Phaser v3.60 Debug has a build of Spector.js embedded in it, which is a WebGL inspector that allows for live inspection of your WebGL calls. Although it's easy to add the Spector extension to a desktop browsr, by embedding it in Phaser we can make it available in mobile browsers too, making it a powerful tool for debugging WebGL games on mobile devices where extensions are not permitted.

      See https://github.com/BabylonJS/Spector.js for more details.

      This method will stop the current capture and returns the result in JSON. It displays the result if the UI has been displayed. This returns undefined if the capture has not been completed or did not find any commands.

      Returns object

    • Checks if the given compressed texture format is supported, or not.

      Parameters

      • baseFormat: string

        The Base Format to check.

      • Optionalformat: number

        An optional GLenum format to check within the base format.

      Returns boolean

    • Updates the function bound to a given custom blend mode.

      Parameters

      • index: number

        The index of the custom blend mode.

      • func: number[]

        The function to use for the blend mode. Specify either 2 elements for src and dest, or 4 elements for separate srcRGB, destRGB, srcAlpha, destAlpha.

      • equation: number | number[]

        The equation to use for the blend mode. This can be either a single equation for both source and destination, or an array containing separate equations for source and destination.

      Returns this

    • Updates a WebGL Texture based on the given Canvas Element.

      Parameters

      • srcCanvas: HTMLCanvasElement

        The Canvas to update the WebGL Texture from.

      • dstTexture: WebGLTextureWrapper

        The destination WebGLTextureWrapper to update.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT (such as for Text objects?) Default false.

      Returns WebGLTextureWrapper

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

      Parameters

      • srcVideo: HTMLVideoElement

        The Video to update the WebGL Texture with.

      • dstTexture: WebGLTextureWrapper

        The destination WebGLTextureWrapper to update.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT? Default false.

      Returns WebGLTextureWrapper

    • Creates or updates a WebGL Texture based on the given HTML Video Element.

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

      Parameters

      • srcVideo: HTMLVideoElement

        The Video to create the WebGL Texture from

      • OptionaldstTexture: WebGLTextureWrapper

        The destination WebGLTextureWrapper to set.

      • OptionalnoRepeat: boolean

        Should this canvas be allowed to set REPEAT? Default false.

      • OptionalflipY: boolean

        Should the WebGL Texture set UNPACK_MULTIPLY_FLIP_Y? Default true.

      Returns WebGLTextureWrapper