使用WebGL或OpenGL ES 2,我如何在屏幕上呈现RBO的内容



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

我的渲染目标设置看起来像这样:

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

我的渲染更新循环是这样的:

  1. 将场景渲染到上面步骤#2中创建的FBO
  2. 用上面步骤#3创建的纹理渲染一个屏幕对齐的四边形

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

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

你不能在WebGL中blit RBO的内容到屏幕,除非你执行回读并重新上传到纹理到blit,这是相当慢的。

WebGL不支持任何形式的fbo上的MSAA(既不支持RBO也不支持RTT)。

你可以用多种方式实现你自己的抗锯齿。

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

最新更新