Question

如果我想在输入纹理中使用某个区域而不是整个区域，则可以使用gl.texSubImage2D()并提供x和y偏移量。

输出纹理的等效值是什么？鉴于在我的片段着色器中，我无法控制要写入的纹理像素。致电gl.viewPort()会成功吗？我需要为此更改画布尺寸吗？

Answer 1

与@J。 van Langen指出您gl.scissor会工作。您需要使用gl.enable(gl.SCISSOR_TEST)启用剪刀测试，然后使用gl.scissor(x, y, width, height)

设置要裁剪的矩形

示例：

const gl = document.querySelector("canvas").getContext("webgl");
gl.enable(gl.SCISSOR_TEST);
gl.scissor(50, 25, 150, 75);
gl.clearColor(1, 0, 0, 1);
gl.clear(gl.COLOR_BUFFER_BIT);  // notice the entire canvas is not cleared

canvas { border: 1px solid black; }

<canvas></canvas>

然后再次取决于您对“偏移”的定义。剪刀矩形只是剪切，它不会偏移（通常是平移）。如前所述，您可以使用gl.viewport进行偏移。 gl.viewport不影响gl.clear。它只会影响分配给gl_Position的顶点如何转换回屏幕坐标以及如何修剪这些顶点。

请务必注意，它会修剪顶点而不是像素，因此在视口边缘绘制的10个像素点（如gl_PointSize = 10.0）将部分地绘制在视口之外。因此，通常如果将视口设置为小于要绘制的内容的全尺寸，则还要启用并设置剪刀矩形。

如何为WebGL中的输出纹理或帧缓冲区提供偏移量？

1 个答案: