如何清除 gl.RGBA8UI 纹理答案

【问题标题】：How to clear a gl.RGBA8UI texture如何清除 gl.RGBA8UI 纹理
【发布时间】：2023-01-08 14:19:11
【问题描述】：

我有一个附加到帧缓冲区的 RGBA8UI 内部格式纹理，不知何故我需要将它重置为默认值。不幸的是，一个简单的 gl.clear(gl.COLOR_BUFFER_BIT) 似乎不起作用，（我怀疑问题是纹理的内部格式），给出了这个错误：

[.WebGL-000020EE00AD4700] GL_INVALID_OPERATION: No defined conversion between clear value and attachment format.

帧缓冲区状态为 FRAMEBUFFER_COMPLETE。这是 jsfiddle 的一个最小示例：

HTML

<canvas id="canvas"></canvas>

const gl = document.getElementById('canvas').getContext('webgl2');

let targetTexture = gl.createTexture();
gl.bindTexture(gl.TEXTURE_2D, targetTexture);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8UI, 1, 1, 0, gl.RGBA_INTEGER, gl.UNSIGNED_BYTE, null);

let fb = gl.createFramebuffer();
gl.bindFramebuffer(gl.FRAMEBUFFER, fb);

gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, targetTexture, 0);

let fstatus = gl.checkFramebufferStatus(gl.FRAMEBUFFER);
console.log(fstatus, gl.FRAMEBUFFER_COMPLETE);

gl.clearColor(0, 0, 0, 0);
gl.clear(gl.COLOR_BUFFER_BIT);

问题

如何清除/重置纹理？

【问题讨论】：

标签： webgl2

【解决方案1】：

那么根据 WebGL 2 spec (Section 3.7.9) 你不能 clear 整数颜色缓冲区：

如果整数颜色缓冲区位于要清除的缓冲区中，则会生成 INVALID_OPERATION 错误并且不会清除任何内容。

所以你必须像你已经做的那样再次调用texImage2D：
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA8UI, 1, 1, 0, gl.RGBA_INTEGER, gl.UNSIGNED_BYTE, null);
或者（可能更有效）使用屏幕空间四边形和片段着色器编写您喜欢的常量值。

【讨论】：

【解决方案2】：

我自己也遇到了这个。 clear 不适用于整数格式。相反，您可以使用：

gl.clearBufferuiv(gl.COLOR, 0, [0, 0, 0, 0]);

还有 clearBufferiv 用于有符号整数格式，clearBufferfv 用于浮点格式和深度，clearBufferfi 专门用于 DEPTH_STENCIL 格式。

文档在这里：https://registry.khronos.org/OpenGL-Refpages/es3.0/html/glClearBuffer.xhtml

【讨论】：