Question

我正在尝试将纹理帧缓冲区复制到WebGL中的另一个纹理帧缓冲区，到目前为止它只是一个黑屏。我可以毫无问题地在纹理帧缓冲区中渲染。

以下是我认为可行的代码（目前适用于iOS）：

// bind source fbo while we remember current fbo
glGetIntegerv(GL_FRAMEBUFFER_BINDING, &current_fbo);
glBindFramebuffer(GL_FRAMEBUFFER, src_framebuffer);

// setup source fbo attachments
glFramebufferTexture2D(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_TEXTURE_2D, src_handle, 0);
//glReadBuffer(GL_COLOR_ATTACHMENT0); <- commented out because it is not available in WebGL

// bind destination fbo
glActiveTexture(GL_TEXTURE0 + i);
glBindTexture(dest_target, dest_handle);

// copy from source to dest
glCopyTexImage2D(dest_target, 0, dest_format, 0, 0, dest_width, dest_height, 0);

// set back original fbo
//glReadBuffer(GL_NONE); 
glBindFramebuffer(GL_FRAMEBUFFER, current_fbo);

WebGL不支持glReadBuffer所以我不能指定它，但是使用WEBGL_draw_buffers扩展它支持多个渲染目标，所以我们可以设置附件没问题（因此渲染到纹理帧缓冲区的工作完美无瑕）。

我意识到由于我无法指定读缓冲区，或许这种技术无法正常工作？任何想法或解决方法？

Answer 1

CopyTexImage2D工作正常。这是2个一致性测试

https://www.khronos.org/registry/webgl/sdk/tests/conformance/textures/copy-tex-image-2d-formats.html?webglVersion=1

https://www.khronos.org/registry/webgl/sdk/tests/conformance/textures/copy-tex-image-and-sub-image-2d.html?webglVersion=1

您是否检查过JavaScript控制台是否有错误？您只需复制0级，这意味着您需要正确设置过滤，或者需要生成mips。 JavaScript控制台可能包含有关纹理不可呈现的错误消息

Answer 2

如果您可以使用WebGL 2.0，您只需执行以下操作：

gl.bindFramebuffer(GL_READ_FRAMEBUFFER, src);
gl.bindFramebuffer(GL_DRAW_FRAMEBUFFER, dst);
gl.blitFramebuffer(src_left, src_bottom, src_right, src_top, 0, 0, dst_width, dst_height, mask, GL_NEAREST);

否则我认为使用gl.copyTexImage2D是正确的。可以找到更详细的答案here。

WebGL复制纹理帧缓冲到纹理帧缓冲？

2 个答案: