WebGLRenderingContext: stencilFuncSeparate() method

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨July 2015⁩.

Note: This feature is available inWeb Workers.

TheWebGLRenderingContext.stencilFuncSeparate() method oftheWebGL API sets the front and/or backfunction and reference value for stencil testing.

Stencilling enables and disables drawing on a per-pixel basis. It is typically used inmultipass rendering to achieve special effects.

Syntax

stencilFuncSeparate(face, func, ref, mask)

Parameters

face

AGLenum specifying whether the front and/or back stencil state isupdated. The possible values are:

gl.FRONT
gl.BACK
gl.FRONT_AND_BACK

func

AGLenum specifying the test function. The default function isgl.ALWAYS. The possible values are:

gl.NEVER: Never pass.
gl.LESS: Pass if(ref & mask) < (stencil & mask).
gl.EQUAL: Pass if(ref & mask) = (stencil & mask).
gl.LEQUAL: Pass if(ref & mask) <= (stencil & mask).
gl.GREATER: Pass if(ref & mask) > (stencil & mask).
gl.NOTEQUAL: Pass if(ref & mask) !== (stencil & mask).
gl.GEQUAL: Pass if(ref & mask) >= (stencil & mask).
gl.ALWAYS: Always pass.

ref

AGLint specifying the reference value for the stencil test. Thisvalue is clamped to the range 0 to 2^n - 1 where n is the number of bitplanesin the stencil buffer. The default value is 0.

mask

AGLuint specifying a bit-wise mask that is used to AND the referencevalue and the stored stencil value when the test is done. The default value is all 1.

Return value

None (undefined).

Examples

The stencil testing is disabled by default. To enable or disable stencil testing, usetheenable() anddisable() methods with the argumentgl.STENCIL_TEST.

gl.enable(gl.STENCIL_TEST);gl.stencilFuncSeparate(gl.FRONT, gl.LESS, 0.2, 1110011);

To get the current stencil function, reference value, or other stencil information,query the following constants withgetParameter().

gl.getParameter(gl.STENCIL_FUNC);gl.getParameter(gl.STENCIL_VALUE_MASK);gl.getParameter(gl.STENCIL_REF);gl.getParameter(gl.STENCIL_BACK_FUNC);gl.getParameter(gl.STENCIL_BACK_VALUE_MASK);gl.getParameter(gl.STENCIL_BACK_REF);gl.getParameter(gl.STENCIL_BITS);