Class: BaseRenderTexture

Tiny. BaseRenderTexture

A BaseRenderTexture is a special texture that allows any display object to be rendered to it.

Hint: All DisplayObjects (i.e. Sprites) that render to a BaseRenderTexture should be preloaded otherwise black rectangles will be drawn instead.

A BaseRenderTexture takes a snapshot of any Display Object given to its render method. The position and rotation of the given Display Objects is ignored. For example:

let baseRenderTexture = new Tiny.BaseRenderTexture(800, 600);
let sprite = Tiny.Sprite.fromImage('spinObj_01.png');

sprite.position.x = 800/2;
sprite.position.y = 600/2;
sprite.anchor.x = 0.5;
sprite.anchor.y = 0.5;


The Sprite in this case will be rendered using its local transform. To render this sprite at 0,0, you can clear the transform

let app = new Tiny.Application();
let renderer = app.renderer;


let baseRenderTexture = new Tiny.BaseRenderTexture(100, 100);
let renderTexture = new Tiny.RenderTexture(baseRenderTexture);

renderer.render(sprite, renderTexture);  // Renders to center of RenderTexture

new Tiny.BaseRenderTexture(width, height, scaleMode, resolution)

Name Type Default Description
width number 100 optional

The width of the base render texture

height number 100 optional

The height of the base render texture

scaleMode number Tiny.settings.SCALE_MODE optional

See Tiny.SCALE_MODES for possible values

resolution number 1 optional

The resolution / device pixel ratio of the texture being generated




Set to true once the base texture has successfully loaded.

This is never true if the underlying source fails to load or has no texture data.


The height of the base texture set when the image has loaded


Type of image defined in source, eg. png or svg


The image url of the texture


Set to true if the source is currently loading.

If an Image source is loading the 'loaded' or 'error' event will be dispatched when the operation ends. An underyling source that is immediately-available bypasses loading entirely.


Set this to true if a mipmap of this texture needs to be generated. This value needs to be set before the texture is used
Also the texture must be a power of two size to work



The image source that is used to create the texture. This is used to store the original Svg source when it is replaced with a canvas element.

TODO: Currently not in use but could be used when re-scaling svg.


Controls if RGB channels should be pre-multiplied by Alpha (WebGL only)
All blend modes, and shaders written for default value. Change it on your own risk.

Default Value:
  • true


Used to store the actual height of the source of this texture


Used to store the actual width of the source of this texture


The resolution / device pixel ratio of the texture

Default Value:
  • 1


The scale mode to apply when scaling this texture

Default Value:
  • Tiny.settings.SCALE_MODE

readonlysourceHTMLImageElement HTMLCanvasElement

The image source that is used to create the texture.

TODO: Make this a setter that calls loadSource();


Scale for source image. Used with Svg images to scale them before rasterization.


The ids under which this BaseTexture has been added to the base texture cache. This is automatically set as long as BaseTexture.addToCache is used, but may not be set if a
BaseTexture is added directly to the BaseTextureCache array.


This will let the renderer know if the texture is valid. If it's not then it cannot be rendered.


The width of the base texture set when the image has loaded


WebGL Texture wrap mode



Checks if source is an SVG image and whether it's loaded via a URL or a data URI. Then calls _loadSvgSourceUsingDataUri or _loadSvgSourceUsingXhr.

inherited _loadSvgSourceUsingDataUri(dataUri)

Reads an SVG string from data URI and then calls _loadSvgSourceUsingString.

Name Type Description
dataUri string

The data uri to load from.

inherited _loadSvgSourceUsingString(svgString)

Loads texture using an SVG string. The original SVG Image is stored as origSource and the created canvas is the new source. The SVG is scaled using sourceScale. Called by _loadSvgSourceUsingXhr or _loadSvgSourceUsingDataUri.

Name Type Description
svgString string

SVG source as string


Loads an SVG string from imageUrl using XHR and then calls _loadSvgSourceUsingString.

Update dimensions from real values

Updates type of the source image.

Destroys this texture

Frees the texture from WebGL memory without destroying this texture object.
This means you can still use the texture later which will upload it to GPU memory again.


Load a source.

If the source is not-immediately-available, such as an image that needs to be downloaded, then the 'loaded' or 'error' event will be dispatched in the future and hasLoaded will remain false after this call.

The logic state after calling loadSource directly or indirectly (eg. fromImage, new BaseTexture) is:

if (texture.hasLoaded) {
   // texture ready for use
} else if (texture.isLoading) {
   // listen to 'loaded' and/or 'error' events on texture
} else {
   // not loading, not going to load UNLESS the source is reloaded
   // (it may still make sense to listen to the events)
Name Type Description
source HTMLImageElement | HTMLCanvasElement

the source object of the texture.

Resizes the BaseRenderTexture.

Name Type Description
width number

The width to resize to.

height number

The height to resize to.

Updates the texture on all the webgl renderers, this also assumes the src has changed.

  • event:update

Changes the source image of the texture.
The original source must be an Image element.

Name Type Description
newSrc string

the path of the image


Fired when BaseTexture is destroyed.

Name Type Description
baseTexture Tiny.BaseTexture

Instance of texture being destroyed.

Fired when a not-immediately-available source fails to load.

Name Type Description
baseTexture Tiny.BaseTexture

Resource errored.

Fired when a not-immediately-available source finishes loading.

Name Type Description
baseTexture Tiny.BaseTexture

Resource loaded.

Fired when BaseTexture is updated.

Name Type Description
baseTexture Tiny.BaseTexture

Instance of texture being updated.

Documentation generated by JSDoc 3.4.3 on Fri Jul 09 2021 19:32:26 GMT+0800 (CST)