Class: ColorMatrixFilter

PIXI .filters. ColorMatrixFilter

new PIXI.filters.ColorMatrixFilter()

filters/color/ColorMatrixFilter.js, line 20

The ColorMatrixFilter class lets you apply a 5x4 matrix transformation on the RGBA
color and alpha values of every pixel on your displayObject to produce a result
with a new set of RGBA color and alpha values. It's pretty powerful!

 var colorMatrix = new PIXI.ColorMatrixFilter();
 container.filters = [colorMatrix];
 colorMatrix.contrast(2);

Author:

Clément Chenebault

Extends

PIXI.AbstractFilter

Members

matrixArray.<number>

Sets the matrix of the color matrix filter

Default Value:

[1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 0, 1, 0]

paddingnumber

The extra padding that the filter might need

uniformsobject

The uniforms as an object

Methods

_colorMatrix(matrix){Array.<number>} filters/color/ColorMatrixFilter.js, line 115

Create a Float32 Array and normalize the offset component to 0-1

Name	Type	Description
`matrix`	Array.<number>	(mat 5x4)

Returns:

Type	Description
Array.<number>	m (mat 5x4) with all values between 0-1

_loadMatrix(matrix, multiply) filters/color/ColorMatrixFilter.js, line 52

Transforms current matrix and set the new one

Name	Type	Description
`matrix`	Array.<number>	(mat 5x4)
`multiply`	boolean	if true, current matrix and matrix are multiplied. If false, just set the current matrix with @param matrix

_multiply(out, a, b){Array.<number>} filters/color/ColorMatrixFilter.js, line 75

Multiplies two mat5's

Name	Type	Description
`out`	Array.<number>	(mat 5x4) the receiving matrix
`a`	Array.<number>	(mat 5x4) the first operand
`b`	Array.<number>	(mat 5x4) the second operand

Returns:

Type	Description
Array.<number>	out (mat 5x4)

inherited applyFilter(renderer, input, output, clear) core/renderers/webgl/filters/AbstractFilter.js, line 93

Applies the filter

Name	Type	Description
`renderer`	PIXI.WebGLRenderer	The renderer to retrieve the filter from
`input`	PIXI.RenderTarget
`output`	PIXI.RenderTarget
`clear`	boolean	Whether or not we want to clear the outputTarget

blackAndWhite(multiply) filters/color/ColorMatrixFilter.js, line 171

Set the black and white matrice
Multiply the current matrix

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

brightness(b, multiply) filters/color/ColorMatrixFilter.js, line 133

Adjusts brightness

Name	Type	Description
`b`	number	value of the brigthness (0 is black)
`multiply`	boolean	refer to ._loadMatrix() method

browni(multiply) filters/color/ColorMatrixFilter.js, line 375

Brown delicious browni filter (thanks Dominic Szablewski)

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

contrast(amount, multiply) filters/color/ColorMatrixFilter.js, line 219

Set the contrast matrix, increase the separation between dark and bright
Increase contrast : shadows darker and highlights brighter
Decrease contrast : bring the shadows up and the highlights down

Name	Type	Description
`amount`	number	value of the contrast
`multiply`	boolean	refer to ._loadMatrix() method

desaturate(multiply) filters/color/ColorMatrixFilter.js, line 263

Desaturate image (remove color)

Call the saturate function

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

inherited getShader(renderer) core/renderers/webgl/filters/AbstractFilter.js, line 64

Grabs a shader from the current renderer

Name	Type	Description
`renderer`	PIXI.WebGLRenderer	The renderer to retrieve the shader from

greyscale(scale, multiply) filters/color/ColorMatrixFilter.js, line 151

Set the matrices in grey scales

Name	Type	Description
`scale`	number	value of the grey (0 is black)
`multiply`	boolean	refer to ._loadMatrix() method

hue(rotation, multiply) filters/color/ColorMatrixFilter.js, line 189

Set the hue property of the color

Name	Type	Description
`rotation`	number	in degrees
`multiply`	boolean	refer to ._loadMatrix() method

kodachrome(multiply) filters/color/ColorMatrixFilter.js, line 358

Color reversal film introduced by Eastman Kodak in 1935. (thanks Dominic Szablewski)

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

negative(multiply) filters/color/ColorMatrixFilter.js, line 273

Negative image (inverse of classic rgb matrix)

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

polaroid(multiply) filters/color/ColorMatrixFilter.js, line 324

Polaroid filter

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

saturate(amount, multiply) filters/color/ColorMatrixFilter.js, line 241

Set the saturation matrix, increase the separation between colors
Increase saturation : increase contrast, brightness, and sharpness

Name	Type	Description
`amount`	number
`multiply`	boolean	refer to ._loadMatrix() method

sepia(multiply) filters/color/ColorMatrixFilter.js, line 290

Sepia image

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

inherited syncUniform() core/renderers/webgl/filters/AbstractFilter.js, line 104

Syncs a uniform between the class object and the shaders.

technicolor(multiply) filters/color/ColorMatrixFilter.js, line 307

Color motion picture process invented in 1916 (thanks Dominic Szablewski)

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method

toBGR(multiply) filters/color/ColorMatrixFilter.js, line 341

Filter who transforms : Red -> Blue and Blue -> Red

Name	Type	Description
`multiply`	boolean	refer to ._loadMatrix() method