Signatur
Beschreibung
Die Eigenschaft height des Interfaces GPUTexture gibt die Höhe der Textur in Texeln zurück. Der Wert entspricht der Höhe, die beim Erzeugen über GPUDevice.createTexture() im Feld size angegeben wurde. Das kann die zweite Array-Komponente ([width, height, depth]) oder die Objekteigenschaft size.height sein. Wurde nichts angegeben, ist der Wert 1.
Gebraucht wird die Eigenschaft vor allem dann, wenn eine Textur an anderer Stelle weiterverarbeitet wird und ihre Maße nicht separat gespeichert sind: zum Beispiel für GPUQueue.writeTexture(), für copyTextureToBuffer(), zum Berechnen von Puffergrößen (bytesPerRow * height) oder für die Anzahl der Workgroups beim Compute-Dispatch.
Der Wert bezieht sich immer auf das Basis-Mip-Level 0. Für ein Mip-Level n berechnet man die Höhe selbst mit Math.max(1, texture.height >> n). Bei Texturen, die von GPUCanvasContext.getCurrentTexture() kommen, entspricht height der Eigenschaft canvas.height zu diesem Zeitpunkt.
Rückgabewert
"1d"-Texturen ist der Wert immer 1.Beispiele
Höhe einer neu erstellten Textur auslesen
const adapter = await navigator.gpu?.requestAdapter();
if (!adapter) throw new Error('WebGPU nicht verfügbar');
const device = await adapter.requestDevice();
const texture = device.createTexture({
size: [512, 256],
format: 'rgba8unorm',
usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST
});
console.log(`${texture.width} x ${texture.height}`);
Pixeldaten mit writeTexture hochladen
const uploadPixels = (device, texture, pixels) => {
const bytesPerRow = texture.width * 4; // rgba8unorm = 4 Byte pro Texel
device.queue.writeTexture(
{ texture },
pixels,
{ bytesPerRow, rowsPerImage: texture.height },
{ width: texture.width, height: texture.height }
);
};
const tex = device.createTexture({
size: { width: 64, height: 32 },
format: 'rgba8unorm',
usage: GPUTextureUsage.TEXTURE_BINDING | GPUTextureUsage.COPY_DST
});
uploadPixels(device, tex, new Uint8Array(64 * 32 * 4).fill(255));
console.log('Hochgeladen:', tex.height, 'Zeilen');
Mip-Level-Höhen und Compute-Dispatch berechnen
const tex = device.createTexture({
size: [1024, 600],
mipLevelCount: 4,
format: 'rgba8unorm',
usage: GPUTextureUsage.STORAGE_BINDING
});
const mipHeight = (texture, level) => Math.max(1, texture.height >> level);
for (let i = 0; i < tex.mipLevelCount; i++) {
console.log(`Mip ${i}: Höhe ${mipHeight(tex, i)}`);
}
// Workgroups für 8x8-Kacheln in Y-Richtung
const groupsY = Math.ceil(tex.height / 8);
console.log('Workgroups Y:', groupsY);
// Wichtig · Fallstricke
- Schreibgeschützt: Eine Zuweisung wie
texture.height = 100wird still ignoriert (im Strict Mode gibt es einenTypeError). Wenn du eine andere Größe brauchst, erzeuge eine neue Textur. Die alte gibst du mitdestroy()frei. - Nur Mip-Level 0: Die Höhe kleinerer Mip-Levels musst du selbst berechnen.
- Canvas-Texturen:
getCurrentTexture()liefert in jedem Frame eine neue Textur. Ändert sich die Größe des Canvas, ändert sich auchheight. Tiefen- und MSAA-Texturen müssen dann passend neu erzeugt werden, sonst gibt es Validierungsfehler. - Grenzen: Die maximal erlaubte Höhe steht in
device.limits.maxTextureDimension2D(bei 1D-Texturen giltmaxTextureDimension1D). - Kompatibilität: WebGPU gibt es nur in sicheren Kontexten und noch nicht in allen Browsern. Prüfe deshalb vorher, ob
navigator.gpuvorhanden ist. Die Eigenschaft ist auch in Web Workern verfügbar.