我翻译这篇教程的目的是为了帮助那些对图形渲染技术有兴趣却又苦于找不到免费中文学习资料的人。在我的身边没有任何一位从事计算机专业的前辈,从刚学会WINDOWS的基本操作到现在,我的计算机技术完全都是一步步自学过来的,算算学编程的历史也近5年时间了。我往往要花一半以上的学习时间用来查学习资料(记得我学GIF图像格式时,用了近2个星期时间才编出了解压和显示GIF图片的程序,主要原因就是资料不够,只看一两篇短篇幅的教程来写程序,其中多数时间花在调试代码和猜格式上)。所以我对那些不是从事计算机专业,身边又没有计算机高手的学习者深有同感——查一堆堆资料是自学中最痛苦的过程。这几天我也正在学BUMP MAPPING算法,在看完一篇简单的E文教程后,我觉得自己也确实应该为中国的教程事业做出一点我微薄的贡献。我并不是个3D高手,也只是个初学OpenGL的新手,所以只能先做翻译了。我也希望我的翻译小样能够抛砖引玉,看到中国越来越多的高手能够真正写点自己的东西,拿出来与大家分享。由于本人水平有限,翻译难免有错误和不妥之处,请多加指正。
为了尊重原作者,同时也是为了读者能够对照原文,在此贴出原文地址:
http://freespace.virgin.net/hugo.elias/graphics/x_polybm.htm
这篇文章比较简单,看完后并不能使你就真正地掌握了该技术,但是它起了一个过渡的作用,它介绍了BUMP MAPPING的一些基本原理,相信你看了它后,再去看BUMP MAPPING的提高教程,就更轻松了。
凹凸映射Bump Mapping

(1)凹凸映射背后的原理

那么你也许会问:我是怎么知道哪些点要亮,哪些点要暗呢?这不难。绝大多数人生活在这样一种环境下——这个环境的大多数光源来自上方(译者注:比如白天主要的光来自太阳,夜晚主要的光来自天花板上的日光灯)。所以向上倾的地方就会更亮,而向下倾的地方就会更暗。所以这种现象使你的眼睛看到一个物体上亮暗区域时,可以判断出它的凹凸情况。相对亮的块被判断是面向上的,相对暗的块被判断是面向下的。所以我只需要给物体上的线条简单得上色。

这个时候你的大脑并没有被完全欺骗,你脑中存留的视觉印象使你仍然有能力判断出这是前一幅图,只是它的光源变了,是从小往上照的你的大脑可能强迫性地判断出它是第一幅图。事实上,你只要始终盯着它,并且努力地想像着光是从右下方向照射的,你就会理解它是凹的(译者注:因为日常生活的习惯,你会很容易把这些图形判断成凸出的图形,但是因为有了上一幅对照图的印象,你可能才会特别注意到这些图块其实还是凹入的,只是判断方法不符合我们日常生活习惯,因为这时大多数光不是从上方照射,而是从下往上照射)。
(2)什么是凹凸图(Bump Map)
凹凸图和纹理图很相似。但是不同的是,凹凸图包含的不是颜色信息,而是凹凸信息。最通常的方法是通过存储高度值实现。我们要用到一个灰色的纹理图,灰色的亮度体现出每个点分别凸出多少(见右图)。这就是一个非常方便的保存凹凸图的方法,而且这种图很容易制作。这副图具体又是怎样被渲染器使用的呢?你接着往下看就会明白了。
当然,你并不一定要把自己局限于这些简单的图形,你可以扩展,用它来做木材,做石头,做脱了漆的墙面,做任何你想做的物体。

(3)那么它是怎么工作的
凹凸映射是补色渲染技术(Phong Shading Technique)的一项扩展,只是在补色渲染里,多边形表面上的法线将被改变,这个向量用来计算该点的亮度。当你加入了凹凸映射,法线向量会略微地改变,怎么改变则基于凹凸图。改变法线向量就会改变多边形的点的颜色值。就这么简单。
现在,有几种方法来达到这个目的(译者注:这个目的指改变法线向量)。我并没有实际编写补色渲染和凹凸映射的程序,但是我在这里将介绍一种我喜欢的方法来实现!
现在我们需要将凹凸图中的高度信息转换成补色渲染用到的法线的调节信息。这个做起来不难,但是解释起来比较费劲。


有很多计算向量的方法,不同的方法精确度不同,但是选择什么方法要取决于你所要求的精确度是个什么层次。最通常的方法是分别计算每个点上X和Y的倾斜度:
x_gradient = pixel(x-1, y) - pixel(x+1, y)
y_gradient = pixel(x, y-1) - pixel(x, y+1)
在得出了这两个精确度后,你就可以计算多边形点的法线了。


这里有一个多边形,图上绘出了它的一条法线向量——n。除此,还有两条向量,它们将用来调节该点法线向量。这两条向量必须与当前被渲染的多边形的凹凸图对齐,换句话说,它们要与凹凸图使用同一种坐标轴。下边的图分别是凹凸图和多边形,两副图都显示了U、V两条向量(译者注:也就是平面2D坐标的两条轴):


现在你可以看到被调节后的新法线向量了。这个调节公式很简单:
New_Normal = Normal + (U * x_gradient) + (V * y_gradient)
有了新法线向量后,你就可以通过补色渲染技术计算出多边形每个点的亮度了。