OES_draw_buffers_indexed.enableiOES() — Methode · JavaScript-Referenz

Signatur

OES_draw_buffers_indexed.enableiOES(target, index)

Beschreibung

enableiOES() gehört zur WebGL-2-Erweiterung OES_draw_buffers_indexed und ist das indizierte Gegenstück zu gl.enable(gl.BLEND). Statt Blending global für alle Zeichenpuffer einzuschalten, schaltet die Methode es nur für den Zeichenpuffer mit dem angegebenen Index ein.

Gebraucht wird das vor allem beim Multiple Render Targets (MRT)-Rendering, etwa beim Deferred Shading oder bei Order-Independent Transparency: In einen Puffer (z. B. Farbe) soll mit Blending geschrieben werden, in einen anderen (z. B. Normalen, Tiefe, IDs) dagegen ohne Blending. Zusammen mit blendFunciOES(), blendEquationiOES() und colorMaskiOES() lassen sich Blending-Zustand und Schreibmaske für jeden Puffer einzeln festlegen.

Die Erweiterung muss vorher mit gl.getExtension("OES_draw_buffers_indexed") aktiviert werden. Die Methode wird am zurückgegebenen Erweiterungsobjekt aufgerufen, nicht am Kontext. Ob Blending für einen Puffer aktiv ist, lässt sich mit ext.isEnablediOES(gl.BLEND, index) abfragen.

Parameter

Name	Typ	Default	Beschreibung
$target Pflicht	GLenum		Die Fähigkeit, die aktiviert werden soll. Einzig gültiger Wert ist `gl.BLEND`.
$index Pflicht	GLuint		Index des Zeichenpuffers (entspricht `gl.COLOR_ATTACHMENT0 + index` bzw. der Position im `gl.drawBuffers()`-Array). Muss kleiner als `gl.getParameter(gl.MAX_DRAW_BUFFERS)` sein.

Rückgabewert

Typ

void

Beschreibung

Kein Rückgabewert (undefined). Fehler werden über gl.getError() gemeldet.

Beispiele

Blending nur für den ersten Zeichenpuffer aktivieren

const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl2');
const ext = gl?.getExtension('OES_draw_buffers_indexed');

if (!ext) {
  console.warn('OES_draw_buffers_indexed wird nicht unterstützt');
} else {
  // Blending nur für COLOR_ATTACHMENT0 einschalten
  ext.enableiOES(gl.BLEND, 0);
  console.log(ext.isEnablediOES(gl.BLEND, 0)); // true
  console.log(ext.isEnablediOES(gl.BLEND, 1)); // false
}

true false

MRT: Farbe mit Blending, Normalen ohne Blending

const gl = document.querySelector('canvas').getContext('webgl2');
const ext = gl.getExtension('OES_draw_buffers_indexed');

// Framebuffer mit zwei Farbanhängen anlegen
const fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);

const makeTex = () => {
  const tex = gl.createTexture();
  gl.bindTexture(gl.TEXTURE_2D, tex);
  gl.texStorage2D(gl.TEXTURE_2D, 1, gl.RGBA8, 512, 512);
  return tex;
};
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, makeTex(), 0);
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT1, gl.TEXTURE_2D, makeTex(), 0);
gl.drawBuffers([gl.COLOR_ATTACHMENT0, gl.COLOR_ATTACHMENT1]);

// Puffer 0: klassisches Alpha-Blending
ext.enableiOES(gl.BLEND, 0);
ext.blendFunciOES(0, gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA);

// Puffer 1: Normalen unverändert überschreiben
ext.disableiOES(gl.BLEND, 1);

console.log(gl.getError() === gl.NO_ERROR);

true

Zustand nach dem Zeichnen zurücksetzen

const gl = document.querySelector('canvas').getContext('webgl2');
const ext = gl.getExtension('OES_draw_buffers_indexed');
const maxBuffers = gl.getParameter(gl.MAX_DRAW_BUFFERS);

const withBlending = (index, draw) => {
  ext.enableiOES(gl.BLEND, index);
  try {
    draw();
  } finally {
    ext.disableiOES(gl.BLEND, index);
  }
};

withBlending(0, () => {
  // gl.drawArrays(...) o. Ä.
});
console.log(`Max. Zeichenpuffer: ${maxBuffers}`);

Max. Zeichenpuffer: 8

// Wichtig · Fallstricke

Nur WebGL 2: Die Erweiterung gibt es nicht für WebGL-1-Kontexte. Immer prüfen, ob getExtension() null liefert. Browser unterstützen sie unterschiedlich gut (Chromium und Firefox ja, Safari nur eingeschränkt).
Ist target nicht gl.BLEND, entsteht gl.INVALID_ENUM. Ist index zu groß, entsteht gl.INVALID_VALUE. Es wird keine Ausnahme geworfen.
gl.enable(gl.BLEND) und gl.disable(gl.BLEND) setzen den Zustand für alle Zeichenpuffer auf einmal und überschreiben damit vorherige indizierte Einstellungen.
Ganzzahl-Formate (z. B. RGBA32UI) lassen sich nicht blenden. Für solche Anhänge wird Blending ignoriert.
Geht der Kontext verloren (webglcontextlost), geht auch das Erweiterungsobjekt verloren. Danach muss es neu angefordert werden.

Siehe auch

OES_draw_buffers_indexed OES_draw_buffers_indexed.disableiOES() OES_draw_buffers_indexed.blendFunciOES() OES_draw_buffers_indexed.blendEquationiOES() OES_draw_buffers_indexed.colorMaskiOES() WebGL2RenderingContext.drawBuffers() WebGLRenderingContext.enable()