Javascript 使用webgl的景深

我想在webgl中模拟“景深”效果， 在圆上移动相机：

在OpenGl中，我将使用累积缓冲区。但不幸的是，webgl不知道这样的缓冲区

---

是否可以使用混合来模拟这种效果？

您还可以将场景渲染到多个不同的帧缓冲区，然后将这些帧缓冲区绑定为纹理，并在最后一次后处理收集过程中累积所有帧缓冲区的颜色。因此，这或多或少是人工积累的方法。

模拟景深的一种简单方法是

• 将场景渲染为纹理
• 使用渲染器将纹理场景模糊到另一个纹理
• 使用深度信息混合2个纹理（对焦场景纹理+模糊场景纹理）

---

有一个。单击微小的*以调整“自由度”滑块。按几次

d

以查看不同的纹理。

好，现在我可以创建帧缓冲区并渲染纹理了。：）但是我认为，创建这么多帧缓冲区不是一个好主意。你需要大量的内存空间。这可能不是一个好主意。不过，AAA游戏最多可以使用12个帧缓冲区。或者，你可以用两个缓冲区来实现，在两个缓冲区之间进行乒乓，或者渲染然后点击，或者只是两个缓冲区的类似组合。我想，我已经找到了另一个版本。我使用了两种不同的着色器：第一个顶点/片段着色器将szene渲染为法线。第二个顶点/片段着色器负责将2个纹理组合为1个纹理。步骤1：使用第一个着色器渲染szene并将结果写入帧缓冲区0。步骤2：使用第一个着色器渲染szene并将结果写入帧缓冲区1。然后将帧缓冲区0的纹理与tramebuffer 1的纹理与第二个着色器组合。将结果写入帧缓冲区2中。