Bloom

Bloom,泛光,这是个什么效果呢?当我们看向光源时,我们的眼睛是没有办法很清晰的看清楚光源的发光点的,我们能看到光源处的一片光晕,这就是bloom的意义。能够让现实世界的光源更像。如下图,右边的灯的样子才更符合现实世界。
bloom

那么怎么做到这一点呢?

我们可看到bloom的效果实际上就是在光源附近做了模糊。那么就很简单了,我们用阈值得到一张只包含光源的图像(可能由些许误差),然后对其做模糊,然后在与原始图像融合就可以了。
bloom1

那么这就会变成两个问题:

  • 如何做模糊
  • 如何融合

模糊:
模糊实际上就是用一个值周围的值来替换这个值,比较常见的是平均值模糊。但是对于图像来说,这是不合适的,因为图像的特殊性,像素点受它的周围近的点的影响跟远的点的影响的权重是不同的。,而平均模糊则是所有的点的权重相同,这是不合适的。因此我们需要选择一种更好的模糊方式,即高斯模糊。
高斯模糊请见下面的链接

融合:
当我们拿到两幅图像时,我们想到了HDR,HDR本身就是可以做多幅图像融合的,所以我们可以先做HDR,然后在做gamma校正,最后就得到了输出后的结果

1
2
3
4
5
6
7
8
9
10
11
12
void main()
{
const float gamma = 2.2;
vec3 hdrColor = texture(scene, TexCoords).rgb;
vec3 bloomColor = texture(bloomBlur, TexCoords).rgb;
hdrColor += bloomColor; // additive blending
// tone mapping
vec3 result = vec3(1.0) - exp(-hdrColor * exposure);
// also gamma correct while we're at it
result = pow(result, vec3(1.0 / gamma));
FragColor = vec4(result, 1.0f);
}

参考资料:
https://learnopengl-cn.github.io/05%20Advanced%20Lighting/07%20Bloom/

显示 Gitment 评论