How can I make the spotlight effect (as in the image), but without WebGL (config type WEBGL in the game settings)? In the examples on the site, there are solutions, but it uses WEBGL. and I have a strict restriction in the project - CANVAS [flashlight_and_spotlight_phaser3]

No, you’ll have to look at the Mozilla tutorial. Not sure how it works with alpha though. Maybe altering the pixels yourself is easier. But, you can also try something else: Use the mask example. The black is actually the background color. So draw your background twice. Try playing with the alpha…

Spotlight effect on config type CANVAS

Phaser 3

Milton February 25, 2021, 2:04pm 4

Then you need to use a CanvasTexture and use lighter or multiply as globalCompositeOperation.

1 Like

Topic		Replies	Views
Background Image Manipulation Phaser 3	14	1001	December 17, 2019
Masked semi-transparent overlay Phaser 3	4	4130	August 12, 2019
How to create a spotlight in Phaser 3? Phaser 3	2	1393	November 9, 2021
Spine and mask rendering bug in Canvas Mode,but working properly in WebGL? Phaser 3	0	563	October 31, 2019
About transparent background Phaser 3	3	4269	February 17, 2020

Spotlight effect on config type CANVAS

Related topics