GPUCanvasContext
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The GPUCanvasContext
interface of the WebGPU API represents the WebGPU rendering context of a <canvas>
element, returned via an HTMLCanvasElement.getContext()
call with a contextType
of "webgpu"
.
Instance properties
canvas
Experimental Read only-
Returns a reference to the canvas that the context was created from.
Instance methods
configure()
Experimental-
Configures the context to use for rendering with a given
GPUDevice
and clears the canvas to transparent black. getCurrentTexture()
Experimental-
Returns the next
GPUTexture
to be composited to the document by the canvas context. unconfigure()
Experimental-
Removes any previously-set context configuration, and destroys any textures produced while the canvas context was configured.
Examples
js
const canvas = document.querySelector("#gpuCanvas");
const context = canvas.getContext("webgpu");
context.configure({
device: device,
format: navigator.gpu.getPreferredCanvasFormat(),
alphaMode: "premultiplied",
});
Specifications
Specification |
---|
WebGPU # gpucanvascontext |
Browser compatibility
BCD tables only load in the browser
See also
- The WebGPU API