使用WebGL实现景深效果

Question

3

我希望能在WebGL中模拟“景深”效果，通过将相机移动在一个圆上： https://en.wikibooks.org/wiki/OpenGL_Programming/Depth_of_Field 在OpenGl中，我可以使用累加缓冲区。但不幸的是，WebGL并不支持此缓冲区。

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

- m1au

2个回答

1

您还可以将场景渲染到几个不同的帧缓冲区，然后将这些帧缓冲区绑定为纹理，并在一个最终的后处理聚合通道中累积所有颜色。因此，这或多或少是手动进行累积的方法。

- Dragan Okanovic

好的，现在我可以创建帧缓冲并渲染到纹理上了。:) 但是我认为，创建这么多帧缓冲不是一个好主意。你需要大量的内存空间。 - m1au

步骤1：使用第一个着色器渲染场景，并将结果写入帧缓冲0。 - m1au

第二步：使用第一个着色器渲染场景，并将结果写入帧缓冲区1。然后使用第二个着色器将帧缓冲区0的纹理与帧缓冲区1的纹理组合。将结果写入帧缓冲区2。 - m1au

第三步：使用第一个着色器渲染场景，并将结果再次写入帧缓冲区1。然后交换帧缓冲区0和帧缓冲区2。使用第二个着色器结合这些帧缓冲区的纹理。 - m1au

正如您所提到的，这将是通过乒乓方式实现的。您认为我的想法可以吗？ - m1au

显示剩余4条评论

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- gman · Accepted Answer

模拟景深的简单方法是

这里有一个示例。点击小星号并调整“dof”滑块。按d几次以查看不同的纹理。