GPURenderPassEncoder: setViewport() 方法
注意：此功能在 Web Workers 中可用。
GPURenderPassEncoder 接口的 setViewport() 方法用于设置光栅化阶段使用的视口，该视口用于将归一化设备坐标线性映射到视口坐标。
语法
js
setViewport(x, y, width, height, minDepth, maxDepth)
参数
x-
一个表示视口最小 X 值的数字，单位为像素。
y-
一个表示视口最小 Y 值的数字，单位为像素。
width-
一个表示视口宽度的数字，单位为像素。
height-
一个表示视口高度的数字，单位为像素。
minDepth-
一个表示视口最小深度值的数字。
maxDepth-
一个表示视口最大深度值的数字。
注意: 如果没有调用 setViewport()，则每个渲染通道的默认值为 (0, 0, 渲染附件宽度, 渲染附件高度, 0, 1)。
返回值
无 (Undefined)。
验证
调用 setViewport() 时必须满足以下条件，否则将生成 GPUValidationError 并且 GPURenderPassEncoder 会失效
x、y、width和height都大于或等于 0。x+width小于或等于渲染通道的渲染附件的宽度（见下方的注释）。y+height小于或等于渲染通道的渲染附件的高度（见下方的注释）。minDepth和maxDepth都包含在 0.0–1.0 的范围内。minDepth小于maxDepth。
注意: 请参阅 GPUCommandEncoder.beginRenderPass() 描述符中指定的颜色和深度/模板附件；宽度和高度基于它们 view 源自的 GPUTexture。
示例
基本代码片段
在典型的画布渲染中，可以使用以下方法将渲染图形的宽度和高度减半
js
passEncoder.setViewport(0, 0, canvas.width / 2, canvas.height / 2, 0, 1);
上下文
在 WebGPU 示例中的 reversedZ 示例 中，setViewport 被多次用于设置不同渲染通道的视口。请研究示例代码列表以获取完整上下文。
例如
js
// …
colorPass.setViewport(
(canvas.width * m) / 2,
0,
canvas.width / 2,
canvas.height,
0,
1,
);
// …
规范
| 规范 |
|---|
| WebGPU # dom-gpurenderpassencoder-setviewport |
浏览器兼容性
加载中…