Chango的数学Shader世界（八）光盘模拟-各向异性，光栅衍射

目的：

参考《GPU Gems》，在UE4中尝试以重现光盘Shader，并对书中的方法进行解析，改进，批评。

参考：

《GPU Gems》

观察：

我越来越意识到观察现实的重要性。

相机和肉眼看到的衍射图案有差别，会多出一些彩虹，很可能是光盘衍射出来的光在相机上发生了类似衍射的现象。

大致的X型图案

有些角度形成的收缩圆弧和放射圆弧图案

分析：

显然与实际效果有差距，这里面有不少原因。我们从原理分析到实现。

简单说，此Shader由两部分组成：各向异性高光+光栅衍射

1.各向异性

这是个十分宽泛的词语，顾名思义。在图形学上通常指从不同方向看，颜色不一样。至于怎么不一样，随便。

所以下面采用什么样的公式，都无所谓，能看就行。

《GPU Gem》提供的公式：

$hiliteColor*exp(-(k*\frac{T\cdot H}{N\cdot H})^{2})$

其中

$H=L+V$

是的，不像光照模型中的H，这个向量没有除以2，也没有归一化。算咱们善于变通，接受你先。

注意：类似之前的改写，我改写了冗余部分，但公式本身不变。

其中hiliteColor不知道是哪国语言，我猜出来了，意思为背景色，即各向异性高光材质的底色。

看公式要从外向里看，我们接下来看到函数：

$y=e^{^{-x^2}}$

用Geogebra或者Mathematica画图，其图像为：

只要注意到其特征，也就是x越接近0，y越为1。也就是说，咱公式里面的自变量越为0，这个各向异性高光就越好。

再看

$k*\frac{T\cdot H}{N\cdot H}$

可以看出，由于我们视角的变化，导致V变化，H变化， $T\cdot H$ 也在变化，那么确实这是各向异性的。

分母这部分其实可以不要，差不多就能看了：

（左：无分母项右：有分母项）

分母干了件什么事呢？当我们的H尽力向N靠时，分母越为1。反之分母趋向0，则式子趋向无穷，y趋向0。

可以看成，在空间的另一个方向上，也作了各向异性。

（因为空间中让 $T\cdot H$ 一样的H，有无数个，H的另一端点形成一个竖直的圆，有了分母，在圆上各点 $H\cdot N$ 都不同，这样此点在整个空间的每一个方向上，基本上都是不同的（忽略分子分母比恰好相同的情况））

沿着某个方向移动，无分母项材质各向异性高光基本不变。

相比之下，右边的有分母项在同样的方向上，各向异性高光也在变化。

再看 $k*\frac{T\cdot H}{N\cdot H}$ 的左边k。当k越大，图上的高光带就越窄，为什么？

高光带都是自变量接近于0的地方，先忽略分母，也就是 $T\cdot H$ 接近于0的地方。当H固定，那些切线必须十分垂直于H，才能高光。注意到光盘模型的切线方向，是绕着圆周的：

当k越大，比如5。原来自变量0.4，现在变成了2，则y从接近1变成了接近0。

换句话说，只有更加垂直于H的T的那些顶点，才有高光了。带子所以细了。

阶段总结：

现实中的各向异性材质不尽相同，包括光盘，这个公式十分随意，所以也不能保证和现实一致，能看就行。

2.光栅衍射一：假设平面波

《GPU Gems》给出的衍射模型基于光波是平面波，也就是理想的平行光。但从我的中文翻译版来看，书上一段话好像有错误：

“从一个光源发射的光波通常近似于平面波”。这是错的，不知道是原作者拉基还是译者拉基。

为什么？平面波这个词有两个意思

“平面波”意思1：

来源于麦克斯韦方程组（Maxwell Equations）。只有是B和E相互垂直的电磁波，就是平面波，如果是这个概念，那不能说“近似”。

我们又一次碰到了这个东西：麦克斯韦方程组。

PS:

我的学习哲理：重要的东西不必追寻，因为它太重要了，它总会出现在你眼前。

同样的，为了了解麦克斯韦方程组，我发现b站上李永乐老师讲解其积分形式很清楚易懂。在这之前，已经有2，3个人向我推荐这个up主了，但我没看。然而，我还是遇到他了。(当然，这只是大致解释了其积分形式。结合场论/向量微积分等，其内容不是那么简单)

并且了解到，其有一个重要的推论，电磁波的电场矢量，是一个完美的Cos/Sin波：

所以我说，我们在水波模拟中详细研究的Sin波，是图形学中基础的基础，它会一次又一次地出现。

并且，没有这个推论，就没有我们之后的光栅衍射近似模型。

“平面波”意思2：

指波阵面的形状是平面波

要了解为什么平行光又称为平面波，先了解声波上球面波等其他形式的波：

显然，在近处点光源是球面波。只有像太阳这种，距离远又大，到地面上十分近似平面波了。

所以说，书上这句话，十分误导人。书上平面波的意思，应该是指波阵面是平面波，也就是平行光。之后的光栅衍射近似模型我们会看到这一点。

最后，我们得出，我们的Shader，只适用于平行光场景。

3.光栅衍射二：微小的表面发生衍射

就像缓慢的水流经过桥洞，当表面细节比可见光波波长（《GPU Gems》这里取近似 $[0.5,1]\mu m$ ，紫到红）大得多时，不会发生衍射。

但当水波经过小孔时，就不一样了：

这在初高中物理上见过的知识，但推导起来好像并不容易。

这让我想起了证明任意形状薄片在水面震动，最后总形成圆形波的数学推导，我反正还没到能看懂的水平：

所幸《GPU Gems》上这篇作者智商和我们差不多(?)，简化了模型：

接下来就引入一个简化很强的假设：

对于两条平行光束，只有波长一致，且相位差等于波长整数倍，才能进入我们眼中：

所以我们的Shader，在细节处，很可能与完美物理模拟差不少。

根据两波相位差为波长整数倍可知，同样的路径，两光程之差为波长整数倍。有公式：

$ud=n\lambda$

其中：

$u=|sin(\alpha )-sin(\beta )|$ ,

注意：避免冗余，符号已改

n为任意正整数， $\lambda$ 为符合条件的波长。

证明：

我采用和以前类似的简化性证明，证明从红色面出发，到绿色面结束的两路程差（也就是两条红绿端点线长度差）= $n\lambda$ 。

十分容易，证明细节略。

又由于可见光波长 $\lambda$ 属于[0.5,1]，得n值范围[ud,2ud]。

根据这个范围限制，又可得出在范围内的可见光波长： $\frac{ud}{n}$

这样，我们最终的衍射颜色就可由伪代码给出：

for(int n=ceil(ud);n<=floor(2ud);n++)
{
c+=Color(ud/n);
}

其中Color函数接受波长，返回该波长对应的RGB颜色

再加上之前的各向异性高光，就是最终颜色。

4.批评：符号混乱，代码与理论不符

《GPU Gems》上对应实现的CG代码，与理论不符，而且符号混乱。u在理论中是u0，在代码中u=u0*d。

而且实现u的方案也不对。我们记得：

$u=|sin(\alpha )-sin(\beta )|$

而代码中的实现是：

$u=|T\cdot H|$

这不一定正确，为什么？举一个反例：

$|T\cdot H|=|T\cdot L+T\cdot V|=|cos(90+\alpha )-cos(90-\beta )|=|-sin(\alpha )-sin(\beta )|$ ，错误。

可以说，这篇文章的理论和实现真是“两头放p”

这样计算的u，会带来光盘的x型形状：

还有个问题，根据我们之前的理论推导，n值范围[ud,2ud]。结果在代码中，他直接给了[1,8]，还要说什么受程序限制。我看是因为根据理论推导出来的Shader实在太丑了，还不如直接给个[1,8]好看，咱就当一个超人呗，看看可见光之外的光。

（理论版本，颜色分割明显）

（1-8版本，颜色变化连续）

当然，我们由于收到UE4 Shader框架的限制，只能把衍射颜色直接给BaseColor，再走它的渲染管线，出来的光强不正常，没有它的效果绚丽

5.批评二：彩虹函数，UE4的HLSL

理论推导时我们说到需要一个彩虹函数Color，接受参数为波长，返回为rgb颜色。

将波长[0.5,1]重新映射到[0,1]，再对应一个r，g，b三根曲线函数图，即可。

《GPU Gems》这篇的实现，既复杂，又拉基，从上面截图你也可以看出它的衍射图看不见紫色光，不说了。

我在实现的时候本想直接从Texture读取，省的造函数。但UE4的Custom节点，又出了bug，在循环里读取tex颜色莫名其妙报错无限循环，不读取tex就一切正常。无奈我们没有自己的一套渲染管线，以后有机会研究。这里直接参考网上，数学实现彩虹函数：

结语

本篇参考《GPU Gems》，在UE4中尝试以重现光盘Shader，并对书中的方法进行解析，改进，批评。

我们看到了尊重物理事实，将理论与实践结合的重要性。