GPUCanvasContext

实验性： 这是一个实验性技术
在生产环境中使用此功能之前，请仔细查看浏览器兼容性表。

安全上下文： 此功能仅在安全上下文 (HTTPS) 中可用，并且仅在某些或所有支持的浏览器中可用。

WebGPU API 的 GPUCanvasContext 接口表示 <canvas> 元素的 WebGPU 渲染上下文，通过使用 contextType 为 "webgpu" 的 HTMLCanvasElement.getContext() 调用返回。

实例属性

canvas 实验性只读: 返回对创建上下文的画布的引用。

实例方法

configure() 实验性: 将上下文配置为使用给定的 GPUDevice 进行渲染，并将画布清除为透明黑色。
getCurrentTexture() 实验性: 返回将由画布上下文合成到文档中的下一个 GPUTexture。
unconfigure() 实验性: 删除所有先前设置的上下文配置，并销毁在画布上下文配置期间生成的任何纹理。

示例

js

const canvas = document.querySelector("#gpuCanvas");
const context = canvas.getContext("webgpu");

context.configure({
  device: device,
  format: navigator.gpu.getPreferredCanvasFormat(),
  alphaMode: "premultiplied",
});

规范

规范
WebGPU # gpucanvascontext

浏览器兼容性

BCD 表仅在浏览器中加载

另请参阅

WebGPU API