In PIXI.js, how can I increase the brightness of a sprite?

Question

I have a sprite created using new PIXI.Sprite.fromImage(path) , how can I increase its brightness in real time?

Answer 1

You can do this using the PIXI ColorMatrixFilter:

 var colorMatrix = [ 1,0,0,0, 0,1,0,0, 0,0,1,0, 0,0,0,1 ]; var filter = new PIXI.ColorMatrixFilter(); filter.matrix = colorMatrix; stage.filters = [filter]; 

Darker:

 var colorMatrix = [ 1,0,0,-0.5, 0,1,0,-0.5, 0,0,1,-0.5, 0,0,0,1 ]; 

Lighter:

 var colorMatrix = [ 1,0,0,0.5, 0,1,0,0.5, 0,0,1,0.5, 0,0,0,1 ]; 

See a brief demo here: http://codepen.io/ianmcgregor/pen/LcjBw