OES_draw_buffers_indexed

Baseline 2022

Newly available

Since December 2022, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.

Die OES_draw_buffers_indexed Erweiterung ist Teil der WebGL API und ermöglicht die Nutzung unterschiedlicher Mischoptionen beim gleichzeitigen Schreiben in mehrere Farb-Puffer.

WebGL-Erweiterungen sind über die Methode WebGLRenderingContext.getExtension() verfügbar. Weitere Informationen finden Sie auch unter Verwendung von Erweiterungen im WebGL Tutorial.

Hinweis: Diese Erweiterung ist nur für WebGL2 Kontexte verfügbar.

Instanzmethoden

OES_draw_buffers_indexed.blendEquationiOES(): Setzt sowohl die RGB- als auch die Alpha-Berechnungsgleichungen für einen bestimmten Zeichnungspuffer.
OES_draw_buffers_indexed.blendEquationSeparateiOES(): Setzt die RGB- und Alpha-Berechnungsgleichungen separat für einen bestimmten Zeichnungspuffer.
OES_draw_buffers_indexed.blendFunciOES(): Definiert, welche Funktion beim Mischen von Pixeln für einen bestimmten Zeichnungspuffer verwendet wird.
OES_draw_buffers_indexed.blendFuncSeparateiOES(): Definiert, welche Funktion beim Mischen von Pixeln für RGB- und Alpha-Komponenten separat für einen bestimmten Zeichnungspuffer verwendet wird.
OES_draw_buffers_indexed.colorMaskiOES(): Legt fest, welche Farbkomponenten beim Zeichnen oder Rendern für einen bestimmten Zeichnungspuffer aktiviert oder deaktiviert werden sollen.
OES_draw_buffers_indexed.disableiOES(): Deaktiviert das Mischen für einen bestimmten Zeichnungspuffer.
OES_draw_buffers_indexed.enableiOES(): Aktiviert das Mischen für einen bestimmten Zeichnungspuffer.

Beispiele

Verwendung der `OES_draw_buffers_indexed` Erweiterung

Aktivieren Sie die Erweiterung mit einem Aufruf von WebGLRenderingContext.getExtension().

const ext = gl.getExtension("OES_draw_buffers_indexed");

Sie können jetzt das Mischen aktivieren, die Mischgleichung, die Mischfunktion und die Farbmaske für einen bestimmten Zeichnungspuffer festlegen.

// 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);

Um Einstellungen für einen bestimmten Zeichnungspuffer abzurufen, verwenden Sie WebGL2RenderingContext.getIndexedParameter().

// 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);

Sie können WebGLRenderingContext.getParameter() verwenden, um zu sehen, wie viele Zeichnungspuffer verfügbar sind.

const maxDrawBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);

Spezifikationen

Specification
WebGL OES_draw_buffers_indexed Extension Specification

Browser-Kompatibilität

BCD tables only load in the browser