opengl-es-2.0 - 使用 WebGL 或 OpenGL ES 2，如何在屏幕上呈现 RBO 的内容？

Question

使用 WebGL(受限于 OpenGL ES 2 API)，我成功渲染到纹理，然后在屏幕上显示该纹理。因为它是一个纹理，所以它没有被抗锯齿。如果我渲染到 RBO 然后在屏幕上显示它，我将能够利用 AA。

我的渲染目标设置如下所示:

1. 创建 FBO
2. 绑定(bind)FBO
3. 创建纹理(要渲染到)
4. 创建深度缓冲区并将其绑定(bind)为 RBO
5. 将纹理和 RBO 附加到 FBO

我的渲染更新循环看起来像这样:

1. 将场景渲染到上面第 2 步中创建的 FBO
2. 渲染一个与上面第 3 步中创建的纹理对齐的屏幕

使用桌面 OpenGL，我会调用 glBlitFramebuffer() 而不是绘制屏幕对齐的四边形。

如何使用抗锯齿渲染我的场景？我需要用 RBO 替换纹理吗？如果是这样，我使用什么调用来绑定(bind) RBO 以绘制屏幕对齐的四边形？

Answer 1

您不能将 RBO 的内容 blit 到 WebGL 中的屏幕，除非您执行回读并重新上传到纹理以 blit，这相当慢。

WebGL 不支持任何形式的 FBO 上的 MSAA(无论是 RBO 还是 RTT)。

您可以通过多种方式实现自己的抗锯齿。

• 以 2:2 大小渲染并缩小(使用 webgl 的谷歌地图执行此操作)
• 以 1:1 大小渲染，对颜色和深度运行 sobel 或 laplace 边缘检测，并使用边缘强度作为权重运行双边高斯模糊(我在我的一些演示中使用了这种技术，效果很好， http://codeflow.org/entries/2011/apr/11/advanced-webgl-part-1/ )
• 使用 GPU Pro 2 的形态抗锯齿配方(我还没有尝试过)