WebGL 发光效果

WebGL glow effect

我开始学习着色器,玩弄 ShaderToy.com。对于我想做的项目,我需要在 WebGL(不是 Bloom)上创建一个任意的辉光滤镜。我想计算 alpha,然后我可以用它来绘制颜色发光或用于一些动画纹理,如火等。

到目前为止我想到了几个想法:

  1. 在每个像素附近的某些区域平均 alpha - 显然很慢
  2. 在一个循环中围绕每个像素转一圈,然后在另一个循环中越过距离,根据形状与该像素的接近程度计算 alpha - 可能同样慢
  3. 模糊整个形状 - 听起来有点矫枉过正,因为我只需要 alpha

还有其他解决方法吗?我能找到的只是来自 bloom-like 过滤器的高斯模糊技术。

简单的发光效果请找这个nvidia document。 基本思路是

  1. 在后台缓冲区渲染场景
  2. 激活效果
  3. 在 FBO 中渲染场景的一些元素
  4. 计算发光效果
  5. 将最终的 FBO 绑定为纹理,并将此效果与后台缓冲区中先前渲染的场景混合