LittleJS Post Processing Plugin
- Supports shadertoy style post processing shaders
- call new PostProcessPlugin() to setup post processing
- can be enabled to pass other canvases through a final shader
- iResolution is the canvas backing store, so it grows with canvasPixelRatio like shadertoy does. Effects that use it only for uv (p/iResolution.xy) are unaffected, but ones that set a feature size from it, like scan lines, get finer as the ratio rises. Divide by getCanvasPixelRatio() to pin them.
- Source
Classes
Members
(static) postProcess :PostProcessPlugin
Global Post Process plugin object
Type:
- PostProcessPlugin
- Source
Methods
(static) postProcessBloom(thresholdopt, strengthopt, sizeopt, includeMainCanvasopt) → {PostProcessPlugin}
Set up post processing with a bloom effect, so bright colors and lights glow
Parameters:
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
threshold | number | <optional> | 0.6 | Brightness where the glow starts, 0 is everything and 1 is only pure white |
strength | number | <optional> | 1 | How much glow to add |
size | number | <optional> | 6 | How far the glow spreads in pixels |
includeMainCanvas | boolean | <optional> | false | Glow the 2D canvas too, off by default so HUD text stays crisp (a HUD drawn with WebGL in gameRenderPost glows either way, draw it with useWebGL=false) |
- Source
Returns:
- Type:
- PostProcessPlugin
Example
postProcessBloom(); // in gameInit, after any Render3DPlugin(static) postProcessBloomShader(thresholdopt, strengthopt, sizeopt) → {string}
Shader code for a bloom effect, the bright parts of the image blurred back over it
- Pass it to PostProcessPlugin, or edit the string to build an effect on top of it
Parameters:
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
threshold | number | <optional> | 0.6 | Brightness where the glow starts, 0 is everything and 1 is only pure white |
strength | number | <optional> | 1 | How much glow to add |
size | number | <optional> | 6 | How far the glow spreads in pixels, which also sets how many samples it takes |
- Source
Returns:
- Type:
- string