Skip to main content
Version: Phaser v4.0.0

ImageLight

The ImageLight Filter Controller.

This filter controller manages the ImageLight effect for a Camera.

ImageLight is a filter for image based lighting (IBL). It is used to simulate the lighting of an image using an environment map and a normal map.

The environment map is an image that describes the lighting of the scene. This filter uses a single panorama image as the environment map. The top of the image is the sky, the bottom is the ground, and the X axis covers a full rotation. This kind of image is distorted towards the top and bottom, as the X axis is stretched wider and wider, so be careful if you're creating your own environment maps.

Cube maps are not supported by Phaser at the time of writing.

The effect is basically a reflection of the environment at infinite range. A sharp environment map will produce a sharp reflection, while a blurry environment map will produce a diffuse reflection. Use the PanoramaBlur filter to create correctly blurred environment maps. Use the NormalTools filter to manipulate the normal map if necessary, using a DynamicTexture to capture the output.

An ImageLight effect is added to a Camera via the FilterList component:


const camera = this.cameras.main;



camera.filters.internal.addImageLight({ texture: 'lightmap' });

camera.filters.external.addImageLight({ texture: 'lightmap' });

Constructor

new ImageLight(camera, [config])

Parameters

nametypeoptionaldescription
cameraPhaser.Cameras.Scene2D.CameraNoThe camera that owns this filter.
configPhaser.Types.Filters.ImageLightConfigYesThe configuration object for the ImageLight effect.

Scope: static

Extends

Phaser.Filters.Controller

Source: src/filters/ImageLight.js#L12
Since: 4.0.0

Inherited Members

From Phaser.Filters.Controller:


Public Members

bulge

bulge: number

Description:

The amount of bulge to apply to the ImageLight effect. This distorts the surface slightly, preventing flat areas in the normal map from reflecting a single flat color. A value of 0.1 is often plenty.

Source: src/filters/ImageLight.js#L114
Since: 4.0.0


colorFactor

colorFactor: Array.<number>

Description:

The color factor to apply to the ImageLight effect. This multiplies the intensity of the light in each color channel. Use values above 1 to substitute for high dynamic range lighting.

Source: src/filters/ImageLight.js#L125
Since: 4.0.0


environmentGlTexture

environmentGlTexture: Phaser.Renderer.WebGL.Wrappers.WebGLTextureWrapper

Description:

The underlying texture used for the ImageLight effect environment map.

Source: src/filters/ImageLight.js#L72
Since: 4.0.0


modelRotation

modelRotation: number

Description:

The initial rotation of the model in radians. This will be overridden by the modelRotationSource if it is set.

Source: src/filters/ImageLight.js#L92
Since: 4.0.0


modelRotationSource

modelRotationSource: Phaser.GameObjects.GameObject, Phaser.Types.Filters.ImageLightSourceCallback, null

Description:

The source of the model rotation, used when the filter renders. If a function, it will be called to get the rotation. If a GameObject, it will be used to get the rotation from the GameObject's world transform. If null, the model rotation will be taken from the modelRotation property.

Source: src/filters/ImageLight.js#L102
Since: 4.0.0


normalGlTexture

normalGlTexture: Phaser.Renderer.WebGL.Wrappers.WebGLTextureWrapper

Description:

The underlying texture used for the ImageLight effect normal map.

Source: src/filters/ImageLight.js#L63
Since: 4.0.0


viewMatrix

viewMatrix: Phaser.Math.Matrix4

Description:

The view matrix used for the ImageLight effect. This controls the orientation of the environment map. You should set this to reflect the perspective of the camera.

Source: src/filters/ImageLight.js#L81
Since: 4.0.0


Inherited Methods

From Phaser.Filters.Controller:


Public Methods

getModelRotation

<instance> getModelRotation()

Description:

Gets the rotation to use for the ImageLight effect. This will use the modelRotationSource if it is set.

Returns: number - The rotation to use for the ImageLight effect in radians.

Source: src/filters/ImageLight.js#L225
Since: 4.0.0


setEnvironmentMap

<instance> setEnvironmentMap(texture)

Description:

Sets the texture to use for the ImageLight effect environment map.

Parameters:

nametypeoptionaldescription
texturestring | Phaser.Textures.TextureNoThe texture to use for the ImageLight effect environment map.

Returns: Phaser.Filters.ImageLight - This ImageLight instance.

Source: src/filters/ImageLight.js#L162
Since: 4.0.0


setNormalMap

<instance> setNormalMap(texture)

Description:

Sets the texture to use for the ImageLight effect normal map. This should match the object being filtered.

Parameters:

nametypeoptionaldescription
texturestring | Phaser.Textures.TextureNoThe texture to use for the ImageLight effect normal map.

Returns: Phaser.Filters.ImageLight - This ImageLight instance.

Source: src/filters/ImageLight.js#L182
Since: 4.0.0


setNormalMapFromGameObject

<instance> setNormalMapFromGameObject(gameObject)

Description:

Sets the normal texture to use for the ImageLight effect from a GameObject. This will use the first data source image in the object's texture. Use this to extract a normal map which was loaded as a data source.

Parameters:

nametypeoptionaldescription
gameObjectPhaser.GameObjects.GameObjectNoThe GameObject to use for the ImageLight effect normal map.

Returns: Phaser.Filters.ImageLight - This ImageLight instance.

Source: src/filters/ImageLight.js#L203
Since: 4.0.0