PixiJS

Namespace: canvasUtils

PIXI.canvasUtils

Utility methods for Sprite/Texture tinting.

Tinting with the CanvasRenderer involves creating a new canvas to use as a texture, so be aware of the performance implications.

Members

PIXI.canvasUtils.cacheStepsPerColorChannel number Deprecated : since 7.3.0 static

Number of steps which will be used as a cap when rounding colors.

Default Value:
  • 8

PIXI.canvasUtils.canUseMultiply boolean static

Whether or not the Canvas BlendModes are supported, consequently the ability to tint using the multiply method.

PIXI.canvasUtils.convertTintToImage boolean static

Tint cache boolean flag.

Default Value:
  • false

PIXI.canvasUtils.tintMethod Function static

The tinting method that will be used.

Methods

PIXI.canvasUtils.getTintedCanvas (sprite, color) ICanvas | HTMLImageElement static

canvasUtils.ts:17

Basically this method just needs a sprite and a color and tints the sprite with the given color.

Name Type Description
sprite PIXI.Sprite

the sprite to tint
sprite.texture
color number

the color to use to tint the sprite with
Returns:
Type Description
ICanvas | HTMLImageElement The tinted canvas

PIXI.canvasUtils.getTintedPattern (texture, color) CanvasPattern static

canvasUtils.ts:72

Basically this method just needs a sprite and a color and tints the sprite with the given color.

Name Type Description
texture PIXI.Texture

the sprite to tint
color number

the color to use to tint the sprite with
Returns:
Type Description
CanvasPattern The tinted canvas

PIXI.canvasUtils.roundColor (color) number Deprecated`` : since 7.3.0 static

canvasUtils.ts:255

Rounds the specified color according to the canvasUtils.cacheStepsPerColorChannel.

Name Type Description
color number

the color to round, should be a hex color
See:
Returns:
Type Description
number The rounded color.

PIXI.canvasUtils.tintWithMultiply (texture, color, canvas) void static

canvasUtils.ts:103

Tint a texture using the 'multiply' operation.

Name Type Description
texture PIXI.Texture

the texture to tint
color number

the color to use to tint the sprite with
canvas PIXI.ICanvas

the current canvas

PIXI.canvasUtils.tintWithOverlay (texture, color, canvas) void static

canvasUtils.ts:161

Tint a texture using the 'overlay' operation.

Name Type Description
texture PIXI.Texture

the texture to tint
color number

the color to use to tint the sprite with
canvas PIXI.ICanvas

the current canvas

PIXI.canvasUtils.tintWithPerPixel (texture, color, canvas) void static

canvasUtils.ts:204

Tint a texture pixel per pixel.

Name Type Description
texture PIXI.Texture

the texture to tint
color number

the color to use to tint the sprite with
canvas PIXI.ICanvas

the current canvas