GPURenderPassEncoder: drawIndexed() 方法

实验性： 这是一个实验性技术

在生产环境中使用此功能前，请仔细查看浏览器兼容性表。

安全上下文：此功能仅在安全上下文（HTTPS）下，以及某些或所有支持的浏览器中可用。

GPURenderPassEncoder 接口的drawIndexed() 方法根据由setVertexBuffer() 和 setIndexBuffer() 提供的顶点和索引缓冲区绘制索引图元。

语法

drawIndexed(indexCount)
drawIndexed(indexCount, instanceCount)
drawIndexed(indexCount, instanceCount, firstIndex)
drawIndexed(indexCount, instanceCount, firstIndex, baseVertex)
drawIndexed(indexCount, instanceCount, firstIndex, baseVertex, firstInstance)

参数

indexCount: 一个数字，定义要绘制的索引数量。
instanceCount 可选: 一个数字，定义要绘制的实例数量。如果省略，则 instanceCount 默认为 1。
firstIndex 可选: 一个数字，定义在索引缓冲区中开始绘制的偏移量（以索引为单位）。如果省略，则 firstIndex 默认为 0。
baseVertex 可选: 一个数字，在索引顶点缓冲区之前添加到每个索引值。如果省略，则 baseVertex 默认为 0。
firstInstance 可选: 一个数字，定义要绘制的第一个实例。如果省略，则 firstInstance 默认为 0。

返回值

无（Undefined）。

示例

在 WebGPU 示例阴影映射示例中，drawIndexed() 在每个动画帧的两个独立的渲染传递中使用，一个用于填充阴影缓冲区，另一个用于绘制场景的主视图。请研究示例代码列表以获取完整的上下文。

// ...

const commandEncoder = device.createCommandEncoder();
{
  const shadowPass = commandEncoder.beginRenderPass(shadowPassDescriptor);
  shadowPass.setPipeline(shadowPipeline);
  shadowPass.setBindGroup(0, sceneBindGroupForShadow);
  shadowPass.setBindGroup(1, modelBindGroup);
  shadowPass.setVertexBuffer(0, vertexBuffer);
  shadowPass.setIndexBuffer(indexBuffer, "uint16");
  shadowPass.drawIndexed(indexCount);

  shadowPass.end();
}
{
  const renderPass = commandEncoder.beginRenderPass(renderPassDescriptor);
  renderPass.setPipeline(pipeline);
  renderPass.setBindGroup(0, sceneBindGroupForRender);
  renderPass.setBindGroup(1, modelBindGroup);
  renderPass.setVertexBuffer(0, vertexBuffer);
  renderPass.setIndexBuffer(indexBuffer, "uint16");
  renderPass.drawIndexed(indexCount);

  renderPass.end();
}

// ...

规范

规范
WebGPU # dom-gpurendercommandsmixin-drawindexed

浏览器兼容性

BCD 表仅在启用 JavaScript 的浏览器中加载。

另请参阅

WebGPU API