WebGL Alpha-Blending API

The following table summarizes the WebGL functions that are relevant to performing alpha-blending operations:

WebGL function Description
gl.enable|disable(gl.BLEND) Enable/disable blending.
gl.blendFunc(sW, dW)

Specify pixel arithmetic. Accepted values for sW and dW are as follows:

  • ZERO
  • ONE
  • SRC_COLOR
  • DST_COLOR
  • SRC_ALPHA
  • DST_ALPHA
  • CONSTANT_COLOR
  • CONSTANT_ALPHA
  • ONE_MINUS_SRC_ALPHA
  • ONE_MINUS_DST_ALPHA
  • ONE_MINUS_SRC_COLOR
  • ONE_MINUS_DST_COLOR
  • ONE_MINUS_CONSTANT_COLOR
  • ONE_MINUS_CONSTANT_ALPHA

In addition, sW can also be SRC_ALPHA_SATURATE.

gl.blendFuncSeparate(sW_rgb, dW_rgb, sW_a, dW_a)

Specify pixel arithmetic for RGB and alpha components separately.

gl.blendEquation(mode)

Specify the equation used for both the RGB blend equation and the alpha blend equation. Accepted values for mode are as follows:

  • gl.FUNC_ADD
  • gl.FUNC_SUBTRACT
  • gl.FUNC_REVERSE_SUBTRACT
gl.blendEquationSeparate(modeRGB, modeAlpha) Set the RGB blend equation and the alpha blend equation separately.
gl.blendColor(red, green, blue, alpha) Set the blend color.
gl.getParameter(name)

Just like with other WebGL variables, it is possible to query blending parameters using gl.getParameter. Relevant parameters are as follows:

  • gl.BLEND
  • gl.BLEND_COLOR
  • gl.BLEND_DST_RGB
  • gl.BLEND_SRC_RGB
  • gl.BLEND_DST_ALPHA
  • gl.BLEND_SRC_ALPHA
  • gl.BLEND_EQUATION_RGB
  • gl.BLEND_EQUATION_ALPHA
..................Content has been hidden....................

You can't read the all page of ebook, please click here login for view all page.
Reset
52.14.121.242