WebGL blend 融合

three.js examples (threejs.org)

Android OpenGLES2.0（十八）——轻松搞定Blend颜色混合 - 简书 (jianshu.com)

融合API

//调用此方法，传入GL_BLEND开启BLEND功能
void glEnable(GLenum cap);
//调用此方法，出入GL_BLEND关闭BLEND功能
void glDisable(GLenum cap);
//设置BLEND颜色，结合glBlendFuncSeparate或glBlendFunc使用
void glBlendColor(GLclampf red,GLclampf green,GLclampf blue,GLclampf alpha);
//设置BLEND方程式
void glBlendEquation(GLenum mode);
//对RGB和Alpha分别设置BLEND方程式
void glBlendEquationSeparate(GLenum modeRGB,GLenum modeAlpha);
//设置BLEND函数
void glBlendFunc(GLenum sfactor,GLenum dfactor);
//对RGB和Alpha分别设置BLEND函数
void glBlendFuncSeparate(GLenum srcRGB,GLenum dstRGB,GLenum srcAlpha,GLenum dstAlpha)

融合公式

• s0表示源(深度近)，d表示目的(深度远)，c表示有glBlendColor设置进来的常量。

简单小实例

glBlendFunc(GL_SRC_ALPHA, GL_ONE_MINUS_SRC_ALPHA); //默认是这个

• 深度小的是source,深度大的是destination.

SSAO 融合方案

• DST:
• SRC:
• RESULT:

参数

• BLEND: true
• BLEND_COLOR: 0, 0, 0, 0
• BLEND_DST_ALPHA: ZERO
• BLEND_DST_RGB: ZERO
• BLEND_EQUATION_ALPHA: FUNC_ADD
• BLEND_EQUATION_RGB: FUNC_ADD
• BLEND_SRC_ALPHA: DST_ALPHA
• BLEND_SRC_RGB: DST_COLOR
• validCommandIds: 751

公式

result = dstcolor * 0 + srccolor * dstcolor

Depth Peel 融合方案

• BLEND: true
• BLEND_COLOR: 0, 0, 0, 0
• BLEND_DST_ALPHA: ONE
• BLEND_DST_RGB: ONE
• BLEND_EQUATION_ALPHA: FUNC_ADD
• BLEND_EQUATION_RGB: FUNC_ADD
• BLEND_SRC_ALPHA: ONE_MINUS_DST_ALPHA
• BLEND_SRC_RGB: ONE_MINUS_DST_ALPHA
• validCommandIds: 109, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110, 110

参数

• BLEND: true
• BLEND_COLOR: 0, 0, 0, 0
• BLEND_DST_ALPHA: ONE
• BLEND_DST_RGB: ONE
• BLEND_EQUATION_ALPHA: FUNC_ADD
• BLEND_EQUATION_RGB: FUNC_ADD
• BLEND_SRC_ALPHA: ONE_MINUS_DST_ALPHA
• BLEND_SRC_RGB: ONE_MINUS_DST_ALPHA
• validCommandIds: 315

公式

result = dstcolor * 1 + srccolor * (1 - dstcolor)

参数

• BLEND: true
• BLEND_COLOR: 0, 0, 0, 0
• BLEND_DST_ALPHA: ONE
• BLEND_DST_RGB: ONE
• BLEND_EQUATION_ALPHA: FUNC_ADD
• BLEND_EQUATION_RGB: FUNC_ADD
• BLEND_SRC_ALPHA: ONE_MINUS_DST_ALPHA
• BLEND_SRC_RGB: ONE_MINUS_DST_ALPHA
• validCommandIds: 436

• BLEND: true
• BLEND_COLOR: 0, 0, 0, 0
• BLEND_DST_ALPHA: ONE_MINUS_SRC_ALPHA
• BLEND_DST_RGB: ONE_MINUS_SRC_ALPHA
• BLEND_EQUATION_ALPHA: FUNC_ADD
• BLEND_EQUATION_RGB: FUNC_ADD
• BLEND_SRC_ALPHA: ONE
• BLEND_SRC_RGB: ONE
• validCommandIds: 628, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629, 629