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 |
瀏覽器相容性
載入中…