PIXI

Class: BaseRenderTexture

PIXI. BaseRenderTexture

A BaseRenderTexture is a special texture that allows any Pixi 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 renderer = PIXI.autoDetectRenderer(1024, 1024, { view: canvas, ratio: 1 });
let baseRenderTexture = new PIXI.BaseRenderTexture(renderer, 800, 600);
let sprite = PIXI.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;

baseRenderTexture.render(sprite);

The Sprite in this case will be rendered to a position of 0,0. To render this sprite at its actual
position a Container should be used:

let doc = new PIXI.Container();

doc.addChild(sprite);

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

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

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

core/textures/BaseRenderTexture.js, line 48
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 PIXI.settings.SCALE_MODE optional

See PIXI.SCALE_MODES for possible values
resolution number 1 optional

The resolution / device pixel ratio of the texture being generated

Extends

Methods

inherited _loadSvgSource()

core/textures/BaseTexture.js, line 429

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)

core/textures/BaseTexture.js, line 455

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)

core/textures/BaseTexture.js, line 514

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
Fires:
  • event:loaded

inherited _loadSvgSourceUsingXhr()

core/textures/BaseTexture.js, line 478

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

inherited _updateImageType()

core/textures/BaseTexture.js, line 390

Updates type of the source image.

destroy()

core/textures/BaseRenderTexture.js, line 128

Destroys this texture

inherited dispose()

core/textures/BaseTexture.js, line 607

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.

inherited protectedloadSource(source)

core/textures/BaseTexture.js, line 267

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.

resize(width, height)

core/textures/BaseRenderTexture.js, line 101

Resizes the BaseRenderTexture.

Name Type Description
width number

The width to resize to.
height number

The height to resize to.

inherited update()

core/textures/BaseTexture.js, line 229

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

Fires:
  • event:update

inherited updateSourceImage(newSrc)

core/textures/BaseTexture.js, line 618

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

Events

inherited error

core/textures/BaseTexture.js, line 215

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

inherited loaded

core/textures/BaseTexture.js, line 207

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