Start · Sprachen · JavaScript · Referenz · WebGLRenderingContext.getRenderbufferParameter()

WebGLRenderingContext.getRenderbufferParameter()

Methode

Liefert Informationen über den aktuell gebundenen Renderbuffer, z. B. Breite, Höhe, internes Format oder Farbtiefe der einzelnen Kanäle.

seit JavaScript Baseline: alle Browser (WebGL 1) Kategorie: webapi

Signatur

WebGLRenderingContext.prototype.getRenderbufferParameter(target, pname)

Beschreibung

Mit getRenderbufferParameter() fragt man Eigenschaften des Renderbuffers ab, der gerade an gl.RENDERBUFFER gebunden ist. Renderbuffer sind Speicherbereiche für Offscreen-Rendering, meist als Tiefen-, Stencil- oder Farbanhang eines Framebuffers. Anders als Texturen kann man aus ihnen nicht im Shader lesen.

Die Methode eignet sich vor allem zum Debuggen und Prüfen. Sie zeigt zum Beispiel, ob renderbufferStorage() die gewünschte Größe angelegt hat, welches interne Format tatsächlich verwendet wird oder wie viele Bits für Tiefe und Stencil zur Verfügung stehen.

Abgefragt wird immer der gebundene Renderbuffer, nicht ein übergebenes Objekt. Vor dem Aufruf muss deshalb gl.bindRenderbuffer(gl.RENDERBUFFER, rb) ausgeführt werden. In WebGL 2 kommt der Parameter gl.RENDERBUFFER_SAMPLES für Multisample-Renderbuffer hinzu.

Parameter

Name Typ Default Beschreibung
$target Pflicht GLenum Muss gl.RENDERBUFFER sein.
$pname Pflicht GLenum Welche Information abgefragt wird:
  • gl.RENDERBUFFER_WIDTH / gl.RENDERBUFFER_HEIGHT: Breite und Höhe in Pixeln
  • gl.RENDERBUFFER_INTERNAL_FORMAT: internes Format, z. B. gl.RGBA4, gl.DEPTH_COMPONENT16, gl.STENCIL_INDEX8, gl.DEPTH_STENCIL
  • gl.RENDERBUFFER_RED_SIZE, GREEN_SIZE, BLUE_SIZE, ALPHA_SIZE, DEPTH_SIZE, STENCIL_SIZE: Bits pro Komponente
  • nur WebGL 2: gl.RENDERBUFFER_SAMPLES, die Anzahl der Samples

Rückgabewert

Typ
GLint | GLenum | null
Beschreibung
Bei Größen- und Bit-Angaben ein GLint, bei RENDERBUFFER_INTERNAL_FORMAT ein GLenum. Bei einem ungültigen target oder pname wird null zurückgegeben und ein INVALID_ENUM-Fehler gesetzt. Ist kein Renderbuffer gebunden, gibt es ebenfalls null und INVALID_OPERATION.

Beispiele

Größe und Format eines Tiefen-Renderbuffers prüfen

const canvas = document.createElement('canvas');
const gl = canvas.getContext('webgl');

const rb = gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, rb);
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_COMPONENT16, 512, 256);

const width = gl.getRenderbufferParameter(gl.RENDERBUFFER, gl.RENDERBUFFER_WIDTH);
const height = gl.getRenderbufferParameter(gl.RENDERBUFFER, gl.RENDERBUFFER_HEIGHT);
const format = gl.getRenderbufferParameter(gl.RENDERBUFFER, gl.RENDERBUFFER_INTERNAL_FORMAT);

console.log(width, height, format === gl.DEPTH_COMPONENT16);
512 256 true

Bit-Tiefen eines Renderbuffers als Debug-Übersicht

const gl = document.createElement('canvas').getContext('webgl');

const describeRenderbuffer = (gl, rb) => {
  gl.bindRenderbuffer(gl.RENDERBUFFER, rb);
  const q = (p) => gl.getRenderbufferParameter(gl.RENDERBUFFER, p);
  return {
    breite: q(gl.RENDERBUFFER_WIDTH),
    hoehe: q(gl.RENDERBUFFER_HEIGHT),
    rot: q(gl.RENDERBUFFER_RED_SIZE),
    gruen: q(gl.RENDERBUFFER_GREEN_SIZE),
    blau: q(gl.RENDERBUFFER_BLUE_SIZE),
    alpha: q(gl.RENDERBUFFER_ALPHA_SIZE),
    tiefe: q(gl.RENDERBUFFER_DEPTH_SIZE),
    stencil: q(gl.RENDERBUFFER_STENCIL_SIZE)
  };
};

const colorRb = gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, colorRb);
gl.renderbufferStorage(gl.RENDERBUFFER, gl.RGBA4, 128, 128);

console.table(describeRenderbuffer(gl, colorRb));
{ breite: 128, hoehe: 128, rot: 4, gruen: 4, blau: 4, alpha: 4, tiefe: 0, stencil: 0 }

WebGL 2: tatsächliche Sample-Anzahl beim Multisampling ermitteln

const gl = document.createElement('canvas').getContext('webgl2');

const rb = gl.createRenderbuffer();
gl.bindRenderbuffer(gl.RENDERBUFFER, rb);

const maxSamples = gl.getParameter(gl.MAX_SAMPLES);
gl.renderbufferStorageMultisample(gl.RENDERBUFFER, Math.min(4, maxSamples), gl.RGBA8, 800, 600);

// Der Treiber darf auf eine höhere unterstützte Anzahl aufrunden
const samples = gl.getRenderbufferParameter(gl.RENDERBUFFER, gl.RENDERBUFFER_SAMPLES);
console.log(`Angefordert: 4, erhalten: ${samples}`);
Angefordert: 4, erhalten: 4

// Wichtig · Fallstricke

  • Nur der gebundene Renderbuffer wird abgefragt. Wer vergisst, vorher bindRenderbuffer() aufzurufen, bekommt die Werte eines anderen Puffers oder null zurück.
  • Die Bit-Tiefen hängen von der Implementierung ab. Treiber dürfen mehr Bits reservieren als angefordert, etwa 8 statt 4 Bits bei RGBA4. Verlasse dich also nicht auf exakte Werte.
  • Vor dem ersten renderbufferStorage() sind Breite und Höhe 0, und das interne Format ist gl.RGBA4.
  • Leistung: Jede get*-Abfrage kann die GPU-Pipeline synchronisieren. Rufe die Methode deshalb nicht in der Render-Schleife auf, sondern nur beim Einrichten oder beim Debuggen.
  • RENDERBUFFER_SAMPLES gibt es nur in WebGL2RenderingContext. In WebGL 1 führt der Parameter zu INVALID_ENUM.
  • Die Methode wird von allen modernen Browsern unterstützt. Wenn der WebGL-Kontext verloren geht (webglcontextlost), liefert sie null.