WebGLRenderingContext: Methode bufferData()
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Hinweis: Dieses Feature ist verfügbar in Web Workers.
Die WebGLRenderingContext.bufferData()
-Methode der WebGL API initialisiert und erstellt den Datenspeicher des Pufferobjekts.
Syntax
bufferData(target, size, usage)
bufferData(target, srcData, usage)
Parameter
target
-
Ein
GLenum
, das den Bindungspunkt (Ziel) angibt. Mögliche Werte:gl.ARRAY_BUFFER
-
Puffer, der Scheitelpunktattribute enthält, wie z.B. Scheitelpunktkoordinaten, Texturkoordinatendaten oder Scheitelpunktfarbdaten.
gl.ELEMENT_ARRAY_BUFFER
-
Puffer, der für Elementindizes verwendet wird.
Bei Verwendung eines WebGL 2 Kontext sind zusätzlich die folgenden Werte verfügbar:
gl.COPY_READ_BUFFER
-
Puffer zum Kopieren von einem Pufferobjekt zu einem anderen.
gl.COPY_WRITE_BUFFER
-
Puffer zum Kopieren von einem Pufferobjekt zu einem anderen.
gl.TRANSFORM_FEEDBACK_BUFFER
-
Puffer für Transform-Feedback-Operationen.
gl.UNIFORM_BUFFER
-
Puffer, der zur Speicherung von Uniform-Blöcken verwendet wird.
gl.PIXEL_PACK_BUFFER
-
Puffer für Pixeltransferoperationen.
gl.PIXEL_UNPACK_BUFFER
-
Puffer für Pixeltransferoperationen.
size
-
Ein
GLsizeiptr
, das die Größe in Bytes des Datenspeichers des Pufferobjekts festlegt. srcData
Optional-
Ein
ArrayBuffer
,SharedArrayBuffer
, einTypedArray
oder einDataView
, der in den Datenspeicher kopiert wird. Wennnull
, wird trotzdem ein Datenspeicher erstellt, dessen Inhalt jedoch nicht initialisiert und undefiniert ist. usage
-
Ein
GLenum
, das das beabsichtigte Nutzungsmuster des Datenspeichers für Optimierungszwecke angibt. Mögliche Werte:gl.STATIC_DRAW
-
Der Inhalt soll einmal von der Anwendung angegeben und viele Male als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
gl.DYNAMIC_DRAW
-
Der Inhalt soll wiederholt von der Anwendung neu angegeben und viele Male als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
gl.STREAM_DRAW
-
Der Inhalt soll einmal von der Anwendung angegeben und höchstens ein paar Mal als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
Bei Verwendung eines WebGL 2 Kontext sind zusätzlich die folgenden Werte verfügbar:
gl.STATIC_READ
-
Der Inhalt soll einmal durch Auslesen von Daten aus WebGL festgelegt und viele Male von der Anwendung abgefragt werden.
gl.DYNAMIC_READ
-
Der Inhalt soll wiederholt durch Auslesen von Daten aus WebGL neu festgelegt und viele Male von der Anwendung abgefragt werden.
gl.STREAM_READ
-
Der Inhalt soll einmal durch Auslesen von Daten aus WebGL festgelegt und höchstens ein paar Mal von der Anwendung abgefragt werden.
gl.STATIC_COPY
-
Der Inhalt soll einmal durch Auslesen von Daten aus WebGL festgelegt und viele Male als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
gl.DYNAMIC_COPY
-
Der Inhalt soll wiederholt durch Auslesen von Daten aus WebGL neu festgelegt und viele Male als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
gl.STREAM_COPY
-
Der Inhalt soll einmal durch Auslesen von Daten aus WebGL festgelegt und höchstens ein paar Mal als Quelle für WebGL-Zeichen- und Bildspezifikationsbefehle verwendet werden.
Rückgabewert
Keiner (undefined
).
Ausnahmen
- Ein
gl.OUT_OF_MEMORY
-Fehler wird ausgelöst, wenn der Kontext nicht in der Lage ist, einen Datenspeicher mit der angegebenensize
zu erstellen. - Ein
gl.INVALID_VALUE
-Fehler wird ausgelöst, wennsize
negativ ist. - Ein
gl.INVALID_ENUM
-Fehler wird ausgelöst, wenntarget
oderusage
nicht einer der erlaubten Enums sind.
Beispiele
Verwendung von bufferData
const canvas = document.getElementById("canvas");
const gl = canvas.getContext("webgl");
const buffer = gl.createBuffer();
gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
gl.bufferData(gl.ARRAY_BUFFER, 1024, gl.STATIC_DRAW);
Abrufen von Pufferinformationen
Um die aktuelle Pufferverwendung und Puffergröße zu überprüfen, verwenden Sie die Methode WebGLRenderingContext.getBufferParameter()
.
gl.getBufferParameter(gl.ARRAY_BUFFER, gl.BUFFER_SIZE);
gl.getBufferParameter(gl.ARRAY_BUFFER, gl.BUFFER_USAGE);
Ermittlung der Größe eines typisierten Arrays
Zum Berechnen des size-Parameters für ein typisiertes Array.
const dataArray = new Float32Array([1, 2, 3, 4]);
const sizeInBytes = dataArray.length * dataArray.BYTES_PER_ELEMENT;
Spezifikationen
Specification |
---|
WebGL Specification # 5.14.5 |
Browser-Kompatibilität
BCD tables only load in the browser