HDR&ToneMapping

关注

原创最新推荐文章于 2026-09-27 14:49:56 发布 1.9w 阅读 AI 写同款· GEO 优化 ›

【ISP图像处理】Tone Mapping基础知识及相关算法（附代码）一般LDR（Low Dynamic Range）图像的颜色显示范围通常只有8位，即每个颜色通道的颜色数值有2^8=256个等级。这个量级用于描述现实场景中的景象往往十分有限，以LDR储存图像往往需要对颜色进行压缩。为了更加真实还原真实场景的颜色，HDR图像应运而生，一般通道位数超过8位，便可称为HDR，常见有12位和16位。虽然存储图像的信息量提升了，但是现在使用的大部分显示设备宽动态范围只有100:1甚至更低。为了使得HDR图像能够在低动态范围的显示设备上显示，Tone Mapping技术便十分重要。阅读详情

HDR

high dynamic range.

很多程序朋友（包括我）都是从dxsdk上看到和学习这个概念，开始学习的更多的是一整套hdr sample的流程：

在float render target上去render scene
- 后面很多console上的游戏使用rgbm等编码方式来节省内存和bandwidth
通过down sample去计算亮度
- treyarch是cook到场景数据里面，省了这个down sample的过程
根据亮度对场景做一个矫正（tone mapping）最后输出到一个rgb8的render target上

但是随着游戏业的画面水准开始向电影水准发展，就需要我们有更好的理解HDR，来进一步把游戏像电影画质推进，这也是近几年的GDC和siggraph上都有一线studio在推HDR相关的技术，比如naughty dog10年的filmic tone mapping，11年crytek在siggraph里面提到的physically based hdr等。

首先看一下概念：

dynamic range：reinhard的<tone mapping>论文中定义：一个场景中最高亮度与最低亮度的比是dynamic range。
low dynamic range : 之所以出现这种情况是图像存储介质（打印纸，照片，电脑屏幕等）精度有限造成的，导致在range上没法完全记录一个场景的亮度信息，只能记录有限的一部分，比如游戏里常见的在rgba8上渲染，每个channel大于1的部分就被截取到1了。
high dynamic range : 准确讲是high dynamic range imaging，是指一种图像技术，它能让图像表示一个比原有技术（之前的LowDynamicRange）更大（greater）的dynamic range
- 这样就可以更加准确和真实的描绘一个场景

进一步说，hdr的存在在于图像存储与表达介质的精度有限，这也是为何游戏引擎大佬在提的都是CG和电影画质，而不是和现实一样的：因为存储介质在这里摆着呢，没法和现实一样，cg是上限。

实际应用中，我们也看到了，hdr除了在range上发力，在精度上也可以更好，比如描绘发暗的场景，可以把亮度矫正到可以充分显示暗部细节。

ToneMapping&ExposureAdjustment

这里除了数学上正确的亮度计算以外，要考虑到人眼视网膜的特点，比如之前的gamma就是一个根据视网膜特点，重新分配亮度信息，来让人眼在有限的显示精度下获得最大的信息量。视网膜有两个典型特点，这里通过tone mapping和exposure adjustment来解决：

自动根据亮度矫正明暗：让我们晚上看东西也能比较清楚，一开灯眼睛要矫正一会回来
局部适应性：比较经典的图是：

这里我们遇到两个问题，各用两个方案解决：

曝光率问题---解决：exposure adjustment。和照相时候曝光原理差不多，白天亮曝光就短一些，晚上曝光长一些，编程时候就是计算render target的平均亮度，然后矫正，这样沙漠的白天和丛林的夜晚都可以在游戏中的rgba8上有一个良好的体现。在hable的论文里，这个属于不同的场景之间的处理问题范畴。
压缩的过程中不可避免的涉及到重新分配亮度值，怎么做来得到更好的尽可能不失真的画面这个解决方案就是tone mapping

实际中也有把这个exposure adjustment并到tone mapping中去，其实还是分开比较好，因为这些概念是从摄像技术中来的，曝光就是曝光，tone mapping就是tone mapping。

ReinhardToneMapping

tone mapping方面比较著名的reinhard哥：

reinhard主页

http://www.cs.ucf.edu/~reinhard/cdrom/

paper link：

http://www.cs.ucf.edu/~reinhard/cdrom/tonemap.pdf

tone mapping干什么的？

dxsdk里面也有说，本来是摄影中提出的概念，解决怎么把场景中范围巨大的亮度值放到范围有限的存储空间中来（照片，打印机。。。），达到一个让人喜欢的结果。

这里面一点是“让人喜欢的结果”，它是一个含有主观意味的东西，没有一个绝对的标准，也没有说什么是绝对的对和错，根据游戏类型和开发者，玩家口味，大可选择自己喜欢的结果，tonemapping是达到这一结果的方法而已。

tonemapping相关的研究是从摄影技术中发展过来的，只不过digital imaging有比摄影洗相片更好的一个优势，可以进一步发展：

首先明确和定义一些概念：

zone：存储空间的亮度阶这么一个概念，比如print只有11个zone
middle grey：中间的亮度
dynamic range：指场景中最高亮度与最低亮度的比值
- 这是一个最学术派的定义，具体上摄像师一般会追求细节还可以明辨的range
key：描述整个场景亮度的数值
dodging and burning：把高亮度的东西亮度降低为dodging，把低亮度的部分加亮为burning

luminance mapping

首先是把场景亮度map到image里，这一步是luminance mapping：

luminance计算：

这个计算使用了log。

step 1: simplest

result = x/(1+x); 最简单的一个情况，就把任意大的亮度encode到0到1之间。

虽然效果不那么好，但这也算一个luminance mapping。

step2：more control

L(white)定义的是在画面上表示纯白的亮度。

dodging and burning

一般来讲像dxsdk里面做的都是全屏统一的一个量度矫正，这个也是可以的，但是reinhard这里面说有时候这样并不太好，比如整个场景很亮，里面一部分很暗的情况(比如亮背景下的一个树），全屏统一做矫正（也就是dodging and burning)，效果就不好。

这时可能在一个较小的区域来进行dodging and burning可以进一步提升local的对比度，可以达到某些情况下的“令人喜欢”。

这里的基本思路就是在一个scale内去搜集亮度等信息，来做进一步计算，operator也很多。

基本上知道这里已经够了。

FilmicToneMapping

gdc10上当时在naughty dog工作的hable的presentation：

http://cmpmedia.vo.llnwd.net/o1/vault/gdc10/slides/Hable_John_Uncharted2_HDRLighting.pptx

后来他又在自己blog上说了更多的细节：（甚至说更重要，ppt上的内容但看的话会有很多不解的地方）

http://filmicgames.com/archives/75

tone mapping就是一个原始颜色向目标颜色映射的过程，不同的函数呈现一些不同的特点，这里列一些，看下对比：

ppt中有更多的一些对比，这里直接总结filmic tone mapping的好处就是：

向暗色过渡的更“脆”
高亮部分更柔和
在input color的match上也更接近linear

最后简单讲，hable把cg工业中的这个operator拿过来用就是因为在实际应用中这个看起来更棒。

这个也是很多电影在用的operator，它的mapping曲线这样的：

实现类似filmic tone mapping的mapping的时候一般是把映射关系放到texture里，然后sample texture，不过有牛人把mapping搞到一个公式里了，hable还加了参数可以让美术调：

A = Shoulder Strength
B = Linear Strength
C = Linear Angle
D = Toe Strength
E = Toe Numerator
F = Toe Denominator
Note: E/F = Toe Angle
LinearWhite = Linear White Point Value
F(x) = ((x*(A*x+C*B)+D*E)/(x*(A*x+B)+D*F)) - E/F;
FinalColor = F(LinearColor)/F(LinearWhite)‏

在具体的代码看hable的blog更好了：

float A = 0.15;
float B = 0.50;
float C = 0.10;
float D = 0.20;
float E = 0.02;
float F = 0.30;
float W = 11.2;

float3 Uncharted2Tonemap(float3 x)
{
   return ((x*(A*x+C*B)+D*E)/(x*(A*x+B)+D*F))-E/F;
}

float4 ps_main( float2 texCoord  : TEXCOORD0 ) : COLOR
{
   float3 texColor = tex2D(Texture0, texCoord );
   texColor *= 16;  // Hardcoded Exposure Adjustment

   float ExposureBias = 2.0f;
   float3 curr = Uncharted2Tonemap(ExposureBias*texColor);

   float3 whiteScale = 1.0f/Uncharted2Tonemap(W);
   float3 color = curr*whiteScale;

   float3 retColor = pow(color,1/2.2);
   return float4(retColor,1);
}