Skip to main content
Version: Phaser v4.0.0

Quantize

The Quantize Filter Controller.

This controller manages the Quantize effect on a Camera.

Quantization reduces the unique number of colors in an image, based on some limited number of steps per color channel. This is good for creating a retro or stylized effect.

Basic quantization breaks each channel up into a number of steps. These steps are normally regular. You can bias them towards the top or bottom by changing that channel's gamma value. You can adjust the lowest step, thus all subsequent steps, with the offset.

Quantization is done in either RGBA or HSVA space. The steps, gamma, and offset always apply in the same order, but depending on color mode, they are either applied to [ red, green, blue, alpha ] or [ hue, saturation, value, alpha ].

The output may optionally be dithered, to eliminate banding and create the illusion that there are many more colors in use.

Constructor

new Quantize(camera, [config])

Parameters

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

Scope: static

Extends

Phaser.Filters.Controller

Source: src/filters/Quantize.js#L10
Since: 4.0.0

Inherited Members

From Phaser.Filters.Controller:


Public Members

dither

dither: boolean

Description:

Whether to apply dither to the quantization, creating a smoother output with the reduced colors.

Source: src/filters/Quantize.js#L142
Since: 4.0.0


gamma

gamma: Array.<number>

Description:

Gamma curve applied to the input channels. This can help prioritize nuances in dark or light areas.

In RGBA mode, the RGB channels can be treated the same. In HSVA mode, you probably want to apply gamma to just the value and saturation channels.

Source: src/filters/Quantize.js#L86
Since: 4.0.0


mode

mode: number

Description:

The color space to use. 0 is RGBA, 1 is HSVA. Use HSVA to control many hues with fewer levels of lightness/saturation.

When the mode changes to HSVA, steps, gamma, and offset now apply to the hue, saturation, value, and alpha channels. They are otherwise unchanged.

Source: src/filters/Quantize.js#L126
Since: 4.0.0


offset

offset: Array.<number>

Description:

Offset to apply to the channels during quantization. This mainly exists to slide the hue angle for HSVA quantization.

Source: src/filters/Quantize.js#L108
Since: 4.0.0


steps

steps: Array.<number>

Description:

How many steps to divide each channel into.

It's often useful to drop the last place to 1, because it's alpha in both RGBA and HSVA, and alpha is often either on or off.

In RGBA mode, the first 3 channels (RGB) should probably be the same, unless there's a stylistic need. In HSVA mode, the first channel (H) should probably have many divisions to distinguish different hues, while the second and third channels (SV) may need fewer steps.

Source: src/filters/Quantize.js#L59
Since: 4.0.0


Inherited Methods

From Phaser.Filters.Controller: