凹凸图和法线图的区别

凹凸图和法线图的区别
2010年09月08日
　　[b]1 前言[/b][b][b]翻译这篇教程的目的是为了帮助那些对图形渲染技术有兴趣却又苦于找不到免费中文学习资料的人。在我的身边没有任何一位从事计算机专业的前辈，从刚学会 WINDOWS的基本操作到现在，我的计算机技术完全都是一步步自学过来的，算算学编程的历史也近5年时间了。我往往要花一半以上的学习时间用来查学习资 料（记得我学GIF图像压缩解压算法时，用了近2个星期时间才编出了显示GIF图片的程序，主要原因就是资料不够，只看一两篇短篇幅的教程来写程序，其中 多数时间花在调试代码和猜格式上）。所以我对那些不是从事计算机专业，身边又没有计算机高手的学习者深有同感――查一堆堆资料是自学中最痛苦的过程。这几 天我也正在学BUMP MAPPING算法，在看完一篇简单的E文教程后，我觉得自己也确实应该为中国的教程事业做出一点我微薄的贡献。我并不是个3D高手，也只是个初学 OpenGL的新手，所以只能先做翻译了。我也希望我的翻译小样能够抛砖引玉，看到中国越来越多的高手能够真正写点自己的东西，拿出来与大家分享。由于本 人水平有限，翻译难免有错误和不妥之处，请多加指正。[b][b]为了尊重原作者，同时也是为了读者能够对照原文，在此贴出原文地址：[b][b]http://freespace.virgin.net/hugo.elias/graphics/x_polybm.htm　 [b][b][b][b][b]2 具体实现[b][b][/b][b][b]2.1 BMEM技术([/b][b]凹凸映射Bump Mapping[/b][b])[/b][b][b]BMEM技术通过一张叫做高度图（Height map）的灰度图来储存每一点的高度信息然后直接由API处理。[b][b][b]
　　[b]
　　
　　
　　[b][b]凹凸映射和纹理映射非常相似。然而，纹理映射是把颜色加到多边形上，而凹凸映射是把粗糙信息加到多边形上。这在多边形的视觉上会产生很吸引人的效果。我们 只需要添加一点信息到本来需要使用大量多边形的物体上。需要注意的是这个物体是平的，但是它看起来却是粗糙不平的。让我们来看看上边的那个立方体。如果你 很近地观察它时，你会发现它上面的很多细节。它看起来好像是由成千上万个多边形构成的，其实它只是由6个矩形构成。你或许会问：“这和纹理映射有什么不 同？”它们的不同之处在于――凹凸映射是一种负责光方向的纹理映射。[b][b][b][b]（1）凹凸映射背后的原理 [b][/b][b]让我们来看看一个粗糙的表面。[b][b]
　　
　　
　　[b]从远处看，你判断这个物体是粗糙的的唯一证据是在它表面上下的亮度有改变。你的大脑能够获得这些亮暗不一的图案信息，然后判断出它们是表面中有凹凸的部 位。上边的一幅图就说明了这一点。你可以发现它是一个浮雕式的表面。一些矩型和字母被印入表面，但是它们摸上去就像是一个隐藏的监控器的玻璃。如果这个图 像是在适当的位置上，那么它除了改变亮度，不需要再做任何其他的工作。[b][b]那么你也许会问：我是怎么知道哪些点要亮，哪些点要暗呢？这不难。绝大多数人生活在这样一种环境下――这个环境的大多数光源来自上方（译者注：比如白天主 要的光来自太阳，夜晚主要的光来自天花板上的日光灯）。所以向上倾的地方就会更亮，而向下倾的地方就会更暗。所以这种现象使你的眼睛看到一个物体上亮暗区 域时，可以判断出它的凹凸情况。相对亮的块被判断是面向上的，相对暗的块被判断是面向下的。所以我只需要给物体上的线条简单得上色。[b][b]如果你想要更多的证据，这里还有一幅几乎相同的图，不同于前的是它旋转了180度。所以它是前一幅图倒转的图像。那些先前看起来是凹进去的区域，现在看起 来是凸出来的了。 [b][b]
　　
　　
　　[b]这时候你的大脑并没有被完全欺骗，你脑中存留的视觉印象使你仍有能力判断出这是前一幅图，只是它的光源变了，是从下往上照的，你的大脑可能强迫性地判断出 它是第一幅图。事实上，你只要始终盯着它，并且努力地想像着光是从右下方向照射的，你就会理解它是凹的（译者注：因为日常生活的习惯，你会很容易把这些图 形判断成凸出的图形，但是因为有了上一幅对照图的印象，你可能才会特别注意到这些图块其实还是凹入的，只是判断方法不符合我们日常生活习惯，因为这时大多 数光不是从上方照射，而是从下往上照射）。[b][b][b][b][b]（2）什么是凹凸图（Bump Map）[/b] [b][b]
　　
　　
　　[b]凹凸图和纹理图很相似。但是不同的是，凹凸图包含的不是颜色信息，而是凹凸信息。最通常的方法是通过存储高度值实现。我们要用到一个灰色的纹理图，灰色的 亮度体现出每个点分别凸出多少（见上图）。这就是一个非常方便的保存凹凸图的方法，而且这种图很容易制作。这副图具体又是怎样被渲染器使用的呢？你接着往 下看就会明白了。[b][b]当然，你并不一定要把自己局限于这些简单的图形，你可以扩展，用它来做木材，做石头，做脱了漆的墙面，做任何你想做的物体。[b][b][b][b][b]（3）[b]凹凸贴图[/b]是怎么工作的[/b][b][b]凹凸映射是补色渲染技术（Phong Shading Technique）的一项扩展，只是在补色渲染里，多边形表面上的法线将被改变，这个向量用来计算该点的亮度。当你加入了凹凸映射，法线向量会略微地改 变，怎么改变则基于凹凸图。改变法线向量就会改变多边形的点的颜色值。就这么简单。[b][b]现在，有几种方法来达到这个目的（译者注：这个目的指改变法线向量）。我并没有实际编写补色渲染和凹凸映射的程序，但是我在这里将介绍一种我喜欢的方法来 实现！[b]现在我们需要将凹凸图中的高度信息转换成补色渲染用到的法线的调节信息。这个做起来不难，但是解释起来比较费劲。[b][b]好的，我们现在将凹凸位图的信息转换成一些小向量――一个向量对应于一个点。请看下边一副放大的凹凸图。相对亮的点比相对暗的点更为凸出。看清楚了吗？[b][b][b]
　　
　　
　　[b]现在计算每个点的向量，这些向量表征了每个点的倾斜情况，请看下图的描绘，图中红色小圆点表示向量是向下的。[b][b]
　　
　　
　　[b]有很多计算向量的方法，不同的方法精确度不同，但是选择什么方法要取决于你所要求的精确度是个什么层次。最通常的方法是分别计算每个点上X和Y的倾斜度：[b][b] x_gradient = pixel(x-1, y) - pixel(x+1, y)[b]. y_gradient = pixel(x, y-1) - pixel(x, y+1)[b]在得出了这两个倾斜度后，你就可以计算多边形点的法线了。[b][b][b]
　　
　　　
　　
　　
　　[b]这里有一个多边形，图上绘出了它的一条法线向量――n。除此，还有两条向量，它们将用来调节该点法线向量。这两条向量必须与当前被渲染的多边形的凹凸图对 齐，换句话说，它们要与凹凸图使用同一种坐标轴。下边的图分别是凹凸图和多边形，两副图都显示了U、V两条向量（译者注：也就是平面2D坐标的两条轴）：[b][b]
　　
　　
　　
　　
　　[b]现在你可以看到被调节后的新法线向量了。这个调节公式很简单：[b][b]New_Normal = Normal + (U * x_gradient) + (V * y_gradient)[b][b]有了新法线向量后，你就可以通过补色渲染技术计算出多边形每个点的亮度了。[b][b][b][b][b][b][b]2.2 [b]法线贴图[/b]法(Normal Map)[/b][b][b]但事实上游戏编程员却通常并不喜欢使用BMEM技术，因为他执行速度慢，因此他们通常使用DP3技术：直接把高度图（Height map）转换成一张法线图（Normal Map），其图的RGB分别是原高度图该点的法线指向：Nx、Ny、Nz，这张图可由Direct3D的专门函数帮助我们计算。最后在渲染的时候直接将该 高度图的每个像素与光源的向量点乘，即可得到表示每一点的明暗系数的图：根据高度图，越突出的地方，法线与光源夹角越小，该点的数值越大。接着将这张图乘 到渲染线中即可，这样就使模型在背光的凹处有阴影而在面向光源处更亮的效果，这样的3D模型看起来就像真的凹凸不平一样！这些都可以直接在渲染流水线中由 机器完成。[b][b]具体可以使用以下简单的语句来实现：//将光源位置转 换成ARGBDWORD Vector2ARGB(D3DXVECTOR3 *v,float height){DWORD r=(DWORD)(127.0f*v->x+128.0f);DWORD g=(DWORD)(127.0f*v->y+128.0f);DWORD b=(DWORD)(127.0f*v->z+128.0f);DWORD a=(DWORD)(255.0f*height);return((aSetRenderState(D3DRS_TEXTUREFACTOR,F);//设置原纹理，如上面的球，如有需要可以贴上纹理样式pD->SetTexture(1,TEXTURE);//使用上面生成好的法线图pD->SetTexture(0,normalmap);//设置“来源1”为法线图pD->SetTextureStageState(0,D3DTSS_COLORARG1,D3DTA_TEXTURE);//将“来源1”（法线图）与“来源2”（光源法线）进行点乘pD->SetTextureStageState(0,D3DTSS_COLOROP,D3DTOP_DOTPRODUCT3);//设置“来源2”为光线的光源法线参数pD->SetTextureStageState(0,D3DTSS_COLORARG2,D3DTA_TFACTOR);//这步和下面几步将图片的原纹理加上pD->SetTextureStageState(1,D3DTSS_COLORARG1,D3DTA_TEXTURE);pD->SetTextureStageState(1,D3DTSS_COLOROP,D3DTOP_MODULATE);pD->SetTextureStageState(1,D3DTSS_COLORARG2,D3DTA_CURRENT);
　　复制代码[b][b][b][b][b][b]2.3 假[b]凹凸贴图[/b][/b][b][b]三维计算机图形程序员有时使用计算量较小的假[b]凹凸贴图[/b]模拟[b]凹凸贴图[/b]效果。其中一个方法是使用纹素索引变化取代曲面法线变化，这种方法经常用于二维[b]凹凸贴图[/b]。在 GeForce 2 类型的图形加速硬件中就使用了这项技术。(或者说利用小尺寸的灰度图来为一张更大尺寸的表面起伏不大的平面提供高度图的索引)[b][b]全屏的二维假[b]凹凸贴 图[/b]，可以很容易地用简单快速的渲染循环实现，在二十世纪九十年代的示范影像是一个非常普通的 视觉效果。[b][b][b][b][b][b][b]3 与位移映射之间的差别[/b][b][b]位移映射与[b]凹凸贴图[/b]之 间[b]区别[/b]在例 图中已经很明显地显现出来了：在[b]凹凸贴图[/b]中，只有法线进行了扰动，而几何体本身没有扰动，这样的结果就是人为改变只出现在物体的轮廓上，而球体本身仍然是原来的圆 形。即[b]凹凸贴图[/b]只 是视觉上的改变，就像一个画得很透视的图片；而位移映射却真的将3D物体变得“凹凸不平”。[b][b][b]Bump Map存储的是高度差，而非Normal Map直接存储法线值。这一点值得让人思考。即，Bump存储一张8bit灰度图，而Normal存储一张24bit RGB彩色图！[b][b]记得第一次见到这个技术好像还是98年前后的时候，好像是MGA系列的显卡用这个东西作为自己卖点（那会鄙人还上中学，年代久远实在记不清了）。至于为什 么不直接存储法线，我觉得是为了数据存储的最小化考虑。因为高度差可以很容易的用定点表示，并用定点纪录当前高度图所在的刻度范围，理论上这种方式表示的 高度图不会有太大的精度问题。反向，法线则不行。而且高度差图像可以很容易的做到压缩，对简单的压缩就是一个高度值，后面跟着幅图像在当前高度的掩码图。[b][b]因为当时DRAM还是不便宜的，所以高压缩比例的纹理存储是首要被满足的目标。当然，我也是按照常理推测，也没有经历过那个年代。如果有网友知道更高深的 原因，还望指教 ：〉[b]
　　[b]总结[/b]
　　法线贴图的执行效率高于凹凸贴图。体积大于凹凸贴图。
　　对于现代显卡来说，使用法线图会带来更高的执行性能。
　　因为显存大了，这点容量对于现代显卡来说算不得什么。
　　对于美术制作来说，法线图工序复杂，特别是一些2D纹理的法线图。
　　出凹凸图相对容易，因此制作流程上可以让美术制作凹凸图，
　　程序提供一个凹凸转法线工具就OK.
[/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b][/b]