WebGLRenderingContext: blendFunc() 方法
注意：此功能在 Web Workers 中可用。
WebGLRenderingContext.blendFunc() 方法屬於 WebGL API，它定義了用於畫素混合運算的函式。
語法
js
blendFunc(sfactor, dfactor)
引數
返回值
無（undefined）。
異常
- 如果 sfactor 或 dfactor 不是列出的可能值之一，則會丟擲
gl.INVALID_ENUM錯誤。 - 如果常量顏色和常量 alpha 值同時用作源和目標因子，則會丟擲
gl.INVALID_ENUM錯誤。
常量
以下常量可用於 sfactor 和 dfactor。
混合顏色的公式可以這樣描述：color(RGBA) = (sourceColor * sfactor) + (destinationColor * dfactor)。RGBA 值介於 0 和 1 之間。
在下表中，RS、GS、BS、AS 分別表示源的紅、綠、藍和透明度分量，而 RD、GD、BD、AD 分別表示目標的紅、綠、藍和透明度分量。同樣，RC、GC、BC、AC 分別表示常量顏色的紅、綠、藍和透明度分量。它們的值都介於 0 和 1 之間（包含）。
| 常量 | 因子 | 描述 |
|---|---|---|
gl.ZERO |
0,0,0,0 | 所有顏色乘以 0。 |
gl.ONE |
1,1,1,1 | 所有顏色乘以 1。 |
gl.SRC_COLOR |
RS、GS、BS、AS | 所有顏色乘以源顏色。 |
gl.ONE_MINUS_SRC_COLOR |
1-RS、1-GS、1-BS、1-AS | 所有顏色乘以 1 減去每個源顏色。 |
gl.DST_COLOR |
RD、GD、BD、AD | 所有顏色乘以目標顏色。 |
gl.ONE_MINUS_DST_COLOR |
1-RD、1-GD、1-BD、1-AD | 所有顏色乘以 1 減去每個目標顏色。 |
gl.SRC_ALPHA |
AS、AS、AS、AS | 所有顏色乘以源 alpha 值。 |
gl.ONE_MINUS_SRC_ALPHA |
1-AS、1-AS、1-AS、1-AS | 所有顏色乘以 1 減去源 alpha 值。 |
gl.DST_ALPHA |
AD、AD、AD、AD | 所有顏色乘以目標 alpha 值。 |
gl.ONE_MINUS_DST_ALPHA |
1-AD、1-AD、1-AD、1-AD | 所有顏色乘以 1 減去目標 alpha 值。 |
gl.CONSTANT_COLOR |
RC、GC、BC、AC | 所有顏色乘以一個常量顏色。 |
gl.ONE_MINUS_CONSTANT_COLOR |
1-RC、1-GC、1-BC、1-AC | 所有顏色乘以 1 減去一個常量顏色。 |
gl.CONSTANT_ALPHA |
AC、AC、AC、AC | 所有顏色乘以一個常量 alpha 值。 |
gl.ONE_MINUS_CONSTANT_ALPHA |
1-AC、1-AC、1-AC、1-AC | 所有顏色乘以 1 減去一個常量 alpha 值。 |
gl.SRC_ALPHA_SATURATE |
min(AS, 1 - AD)、min(AS, 1 - AD)、min(AS, 1 - AD)、1 | RGB 顏色乘以源 alpha 值或 1 減去目標 alpha 值中較小者。alpha 值乘以 1。 |
示例
要使用混合函式，您必須首先使用 WebGLRenderingContext.enable() 並傳入引數 gl.BLEND 來啟用混合。
js
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_COLOR, gl.DST_COLOR);
要獲取當前的混合函式，請查詢 BLEND_SRC_RGB、BLEND_SRC_ALPHA、BLEND_DST_RGB 和 BLEND_DST_ALPHA 常量，它們將返回一個混合函式常量。
js
gl.enable(gl.BLEND);
gl.blendFunc(gl.SRC_COLOR, gl.DST_COLOR);
gl.getParameter(gl.BLEND_SRC_RGB) === gl.SRC_COLOR;
// true
規範
| 規範 |
|---|
| WebGL 規範 # 5.14.3 |
瀏覽器相容性
載入中…