GPUQueue: writeBuffer() 方法

实验性: 这是一个 实验性技术
在生产环境中使用之前,请仔细查看 浏览器兼容性表

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

writeBuffer()GPUQueue 接口的一个方法,用于将提供的数据源写入给定的 GPUBuffer

这是一个便捷函数,提供了一种替代通过缓冲区映射和缓冲区到缓冲区复制设置缓冲区数据的方法。它允许用户代理确定最有效的复制数据方法。

语法

js
writeBuffer(buffer, bufferOffset, data, dataOffset, size)

参数

buffer

一个 GPUBuffer 对象,表示要写入数据到的缓冲区。

bufferOffset

一个数字,表示在 GPUBuffer 内开始写入数据的偏移量(以字节为单位)。

data

一个对象,表示要写入 GPUBuffer 的数据源。可以是 ArrayBufferTypedArrayDataView

dataOffset 可选

一个数字,表示从数据源内部开始写入数据的偏移量。如果dataTypedArray,则此值为元素数量,否则为字节数量。如果省略,则dataOffset默认为 0。

size 可选

一个数字,表示要从data写入到buffer的内容的大小。如果dataTypedArray,则此值为元素数量,否则为字节数量。如果省略,则size将等于data的总大小减去dataOffset

返回值

无(Undefined)。

异常

OperationError DOMException

如果以下条件不满足,则该方法会抛出OperationError

  • data的大小等于或大于 0。
  • dataOffset等于或小于data的大小。
  • data的大小(在TypedArray的情况下转换为字节时)是 4 的倍数。

验证

调用writeBuffer()时必须满足以下条件,否则会生成GPUValidationError,并且GPUQueue将变为无效

  • buffer可供使用,即不可用(如果GPUBuffer当前映射或已使用GPUBuffer.destroy()方法销毁,则不可用)。
  • bufferGPUBuffer.usage包含GPUBufferUsage.COPY_DST标志。
  • bufferOffset(转换为字节后)是 4 的倍数。
  • data - dataOffset + bufferOffset的大小(转换为字节后)等于或小于bufferGPUBuffer.size

示例

在我们的基本渲染演示中,我们在Float32Array中定义了一些顶点数据,我们将使用这些数据来绘制一个三角形。

js
const vertices = new Float32Array([
  0.0, 0.6, 0, 1, 1, 0, 0, 1, -0.5, -0.6, 0, 1, 0, 1, 0, 1, 0.5, -0.6, 0, 1, 0,
  0, 1, 1,
]);

要在渲染管道中使用此数据,我们需要将其放入GPUBuffer中。首先,我们将创建缓冲区。

js
const vertexBuffer = device.createBuffer({
  size: vertices.byteLength, // make it big enough to store vertices in
  usage: GPUBufferUsage.VERTEX | GPUBufferUsage.COPY_DST,
});

要将数据放入缓冲区,我们可以使用writeBuffer()

js
device.queue.writeBuffer(vertexBuffer, 0, vertices, 0, vertices.length);

规范

规范
WebGPU
# dom-gpuqueue-writebuffer

浏览器兼容性

BCD 表格仅在浏览器中加载

另请参阅