OES_draw_buffers_indexed
OES_draw_buffers_indexed 擴充套件是 WebGL API 的一部分，它允許在同時寫入多個顏色緩衝區時使用不同的混合選項。
可以使用 WebGLRenderingContext.getExtension() 方法來訪問 WebGL 擴充套件。有關更多資訊，請參閱 WebGL 教程中的 使用擴充套件。
注意：此擴充套件僅適用於 WebGL2 上下文。
例項方法
OES_draw_buffers_indexed.blendEquationiOES()-
為特定的繪圖緩衝區設定 RGB 和 Alpha 混合方程。
OES_draw_buffers_indexed.blendEquationSeparateiOES()-
分別為特定的繪圖緩衝區單獨設定 RGB 和 Alpha 混合方程。
OES_draw_buffers_indexed.blendFunciOES()-
定義為特定繪圖緩衝區混合畫素時使用的函式。
OES_draw_buffers_indexed.blendFuncSeparateiOES()-
分別為 RGB 和 Alpha 分量定義為特定繪圖緩衝區混合畫素時使用的函式。
OES_draw_buffers_indexed.colorMaskiOES()-
設定在為特定繪圖緩衝區繪製或渲染時啟用或停用哪些顏色分量。
OES_draw_buffers_indexed.disableiOES()-
停用特定繪圖緩衝區的混合。
OES_draw_buffers_indexed.enableiOES()-
啟用特定繪圖緩衝區的混合。
示例
使用 OES_draw_buffers_indexed 擴充套件
透過呼叫 WebGLRenderingContext.getExtension() 來啟用擴充套件。
js
const ext = gl.getExtension("OES_draw_buffers_indexed");
現在您可以為特定的繪圖緩衝區啟用混合、設定混合方程、混合函式和顏色掩碼。
js
// For gl.DRAW_BUFFER0
ext.enableiOES(gl.BLEND, 0);
ext.blendEquationiOES(0, gl.FUNC_ADD);
ext.blendFunciOES(0, gl.ONE, gl.ONE);
ext.colorMaskiOES(0, 1, 0, 0, 0);
// For gl.DRAW_BUFFER1
ext.enableiOES(gl.BLEND, 1);
ext.blendEquationSeparateiOES(1, gl.FUNC_ADD, gl.FUNC_SUBTRACT);
ext.blendFuncSeparateiOES(
1,
gl.SRC_ALPHA,
gl.ONE_MINUS_SRC_ALPHA,
gl.ZERO,
gl.ZERO,
);
ext.colorMaskiOES(1, 0, 1, 0, 0);
要檢索特定繪圖緩衝區的設定，請使用 WebGL2RenderingContext.getIndexedParameter()。
js
// For gl.DRAW_BUFFER0
gl.getIndexedParameter(gl.BLEND_EQUATION_RGB, 0);
gl.getIndexedParameter(gl.BLEND_EQUATION_ALPHA, 0);
gl.getIndexedParameter(gl.BLEND_SRC_RGB, 0);
gl.getIndexedParameter(gl.BLEND_SRC_ALPHA, 0);
gl.getIndexedParameter(gl.BLEND_DST_RGB, 0);
gl.getIndexedParameter(gl.BLEND_DST_ALPHA, 0);
gl.getIndexedParameter(gl.COLOR_WRITEMASK, 0);
// For gl.DRAW_BUFFER1
gl.getIndexedParameter(gl.BLEND_EQUATION_RGB, 1);
gl.getIndexedParameter(gl.BLEND_EQUATION_ALPHA, 1);
gl.getIndexedParameter(gl.BLEND_SRC_RGB, 1);
gl.getIndexedParameter(gl.BLEND_SRC_ALPHA, 1);
gl.getIndexedParameter(gl.BLEND_DST_RGB, 1);
gl.getIndexedParameter(gl.BLEND_DST_ALPHA, 1);
gl.getIndexedParameter(gl.COLOR_WRITEMASK, 1);
您可以使用 WebGLRenderingContext.getParameter() 來檢視有多少個繪圖緩衝區可用。
js
const maxDrawBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);
規範
| 規範 |
|---|
| WebGL OES_draw_buffers_indexed 擴充套件規範 |
瀏覽器相容性
載入中…