推广

OpenGL学习27——伽马校正

iseeyu2年前 (2024-02-21)推广146

Gamma与线性颜色条

上图中，上方颜色条显示的亮度看起来是成比例变化的，双倍的亮度值我们看着的感受也是双倍的亮度变化。但是对于光的物理亮度来说，即离开光源的光子数量，下方颜色条显示的才是正确亮度。但由于我们人眼感知亮度的差异，下方颜色条看起来有点奇怪。正是由于人眼更倾向于根据上方颜色条的比例关系来感知亮度，且显示器使用对数关系显示输出颜色，因此实际上的物理亮度以非线性的关系进行映射。

虽然显示器的非线性映射可以输出我们人眼更能接受的亮度，但是在渲染图像时却会产生问题（见下图）。实心红色线表示显示器的颜色空间，中间点线代表线性颜色空间。假设有一个光颜色矢量(0.5, 0.0, 0.0)，颜色值翻倍确实生成颜色矢量(1.0, 0.0, 0.0)。但是原始的光颜色矢量(0.5, 0.0, 0.0)在屏幕上实际显示的值却是(0.218, 0.0, 0.0)，因此对光颜色翻倍最终在屏幕上显示的颜色是原来的4.5倍左右。（图片取自书中）

不同的颜色映射关系

小结：归根结底就是，我们在程序中进行颜色计算是按线性关系进行，而屏幕显示颜色却是非线性的，颜色的计算与显示不匹配导致失真。

1. 伽马校正

伽马校正（gamma correction）：在显示到屏幕之前对最终输出颜色进行与屏幕伽马值相反的操作。看上方图像中的红色虚线，我们将线性空间颜色输出值与该相反的伽马曲线相乘，当颜色显示到屏幕时，显示器的伽马曲线应用到颜色上正好将颜色转换为线性关系。
2.2是默认伽马值，该值是大部分显示器平均伽马值的估计。伽马值2.2产生的颜色空间称为sRGB颜色空间。
场景中应用伽马校正的两种方式：
- 1. 使用OpenGL内置的sRGB帧缓冲区。
- 1. 在片元着色器中进行自定义的伽马校正。
第一种方式很容易，但是我们也基本无法进行控制。启用GL_FRAMEBUFFER_SRGB相当于告诉OpenGL后续所有绘制操作在存储到颜色缓冲区前都进行伽马校正操作。

glEnable(GL_FRAMEBUFFER_SRGB);

注意：因为伽马校正将颜色从线性空间转换到非线性空间，因此使用第一种方式我们应该在最后一步才启用伽马校正。如果我们不是在最后输出进行颜色伽马校正，那么我们后续的颜色计算都是在非线性空间进行。
第二种方式我们则是在每个相关的片元着色器运行结尾处执行伽马校正。

void main()
{
    // do lighting in linear space
    ...

    // gamma correction
    float gamma = 2.2;
    FragColor.rgb = pow(fragcolor, vec3(1/gamma));
}

注意：对于第二种方式，为了保持一致，我们应该对所有对最终输出有贡献的片元着色器进行伽马校正。如果我们有多个片元着色器，那么我们需要在这些着色器中都添加上述伽马校正的代码。一个简单的解决方案是我们引入后处理阶段，这样我们只需在最终的屏幕四方形输出上执行一次伽马校正。
直接应用伽马校正前后的渲染结果对比。

不进行伽马校正

进行伽马校正

2. sRGB纹理

当我们在计算机上绘制、编辑图像，我们其实不是在线性空间进行的而是在sRGB空间。当我们使用这些图像作为纹理，并在程序中进行伽马校正的话，那么我们其实相当于进行了两次伽马校正，从而导致图像过亮，就像上面应用了伽马校正渲染的地板一样。要解决这个问题，我们需要在执行颜色计算之前，将sRGB纹理转换到线性空间。

float gamma = 2.2;
vec3 diffuseColor = pow(texture(diffuse, texcoords).rgb, vec3(gamma));

如果所有纹理都需要执行这样的处理是相当麻烦的，幸运的是，OpenGL为我们提供GL_SRGB和GL_SRGB_ALPHA纹理格式可以解决我们的问题。如果我们在OpenGL中以这两种格式创建纹理，那么OpenGL会在我们使用纹理时自动将颜色校正到线性空间。

glTexImage2D(GL_TEXTURE_2D, 0, GL_SRGB, width, height, 0, GL_RGB, GL_UNSIGNED_BYTE, image);

注意：并不是所有图像都处于sRGB空间，因此谨慎使用上述格式设置纹理。
对纹理和渲染应用伽马校正的渲染效果对比。

不进行伽马校正

纹理和颜色的伽马校正

3. 衰减（attenuation）

渲染中另一个与伽马校正相关的是光线衰减。在现实物理世界，光线衰减与光源位置距离的平方基本成反比，就是说光的强度随着与光源距离平方的增加而降低。

float attenuation = 1 / (distance * distance);

如果直接应用上述公式衰减效果一般过于强烈，因此我们一般使用线性公式：

float attenuation = 1 / distance;

在没有伽马校正的情况下，线性公式相对于平方公式可以产生更可信的效果。但是当我们应用伽马校正线性公式的效果看起来却太过微弱，而物理上正确的平方公式却可以产生更好的效果。
没有伽马校正与衰减的渲染效果对比。

线性衰减

平方衰减
伽马校正与衰减的渲染效果对比。

线性衰减

平方衰减

4. 小结

问题：程序中的颜色计算是在线性空间中进行；屏幕显示颜色是在sRGB空间进行，两者不匹配。
应用伽马校正解决上述问题：
- 1. 如果没使用纹理，那么我们在颜色写入帧缓冲区前执行一次伽马校正。
- 1. 如果使用了纹理，需要根据纹理的类型：线性或sRGB，对纹理进行设置，让OpenGL在使用纹理前自动进行转换，确保计算在线性空间进行。
- 1. 如果场景中涉及到光线衰减，不进行伽马校正的场景应用线性衰减公式（），进行伽马校正的场景应用平方衰减公式（）。