📄 bumpmap.htm
字号:
<!--Header-->
<HTML>
<HEAD>
<TITLE>GPMega - Advanced Section - Bump Mapping</TITLE>
<META NAME="DESCRIPTION" CONTENT="Tom Hammersley overviews 3 different bump mapping methods. Each by a different person, he goes into the plus's and minus's of each method and talks about his personal favorite.">
</HEAD>
<BODY BGCOLOR=#000000 TEXT=#FFFFFF LINK=#00FF00 VLINK=#00FF00 ALINK=#0000FF>
<!--End Header-->
<!--Advertiser-->
<CENTER>
<TABLE>
<TR>
<TD>
<A HREF="http://www.ugo.com/">
<IMG SRC="/GPMega/ugologo120.gif" BORDER=0 WIDTH=120 HEIGHT=60></A>
</TD>
<TD>
<IMG SRC="/GPMega/sponsored.gif" WIDTH=468 HEIGHT=10><br><br>
<SCRIPT LANGUAGE= "JavaScript">
<!--
var now = new Date();
var random_num = now.getSeconds();
document.write("<A HREF='http://www.ugo.net/RealMedia/ads/click_nx.cgi/www.perplexed.com/GPMega/advanced/bumpmap.htm/" + random_num + "/@Top'>");
document.write("<IMG SRC='http://www.ugo.net/RealMedia/ads/adstream_nx.cgi/www.perplexed.com/GPMega/advanced/bumpmap.htm/" + random_num + "/@Top' BORDER='0' WIDTH='468' HEIGHT='60'></A>");
//-->
</SCRIPT>
</TD>
</TR>
</TABLE>
</CENTER>
<!--End Advertiser-->
<!--Splitter-->
<BR>
<!--End Splitter-->
<!--Body-->
<FONT SIZE=2 FACE=Helvetica>
<STRONG>
<!--Top Navigation-->
<A NAME="top"></A>
<CENTER>
<TABLE WIDTH=75%>
<TR VALIGN=MIDDLE>
<TD ALIGN=LEFT>
<IMG SRC="gradsplit2.jpg" WIDTH=100% HEIGHT=1><BR><BR>
<A HREF="http://www.perplexed.com/GPMega/"><IMG SRC="logo.jpg" BORDER=0 ALT="Home" WIDTH=80 HEIGHT=47 ALIGN=CENTER></A>
<FONT COLOR=#666666 FACE=HELVETICA SIZE=-1><I>
This Article Is Taken From <A HREF="http://www.perplexed.com/GPMega/">The Game Programming MegaSite</A>, A Definitive Resource For Game Developers!
</I></FONT><BR>
<IMG SRC="gradsplit2.jpg" WIDTH=100% HEIGHT=1>
</TD>
</TR>
</TABLE>
</CENTER>
<BR><!--End Top Navigation-->
<!--Title-->
<H3 ALIGN=CENTER><font color="#FFEA00">B</font><font color="#FFD500">u</font><font color="#FFC000">m</font><font color="#FFAB00">p</font><font color="#FF9600"> </font><font color="#FF8100">M</font><font color="#FF6C00">a</font><font color="#FF5700">p</font><font color="#FF4200">p</font><font color="#FF2D00">i</font><font color="#FF1800">n</font><font color="#FF0300">g</font><BR><FONT SIZE=-2>By: Tom Hammersley</FONT></H3>
<!--End Title-->
<H3><FONT COLOR=YELLOW><I>Introduction</I></FONT></H3>
<P>OK, I've been getting lotsa replies on the bump mapping scene, so I think its time to report on what you've been
passing on. I'll try and give credit where its due (if I can find your addresses...). Great reponse, keep it up...
<H3><FONT COLOR=YELLOW><I>#1: Jean-Francois Dube</I></FONT></H3>
<P>Ok, Jean (deks) was first off the mark. His scheme is quite complex, reminds me a lot of water in some places... The basic idea
however is very similar to other schemes. I'll start of with a modified sample of code he sent me, I've made it into pseudo-code:
<CENTER><P><TABLE WIDTH=65% CELLPADDING=0 CELLSPACING=0>
<TR><TD>
<TABLE><TR><TD>
<PRE><FONT COLOR=#FF0000 FACE=Courier SIZE=2>
for x1 to x2 do
normal-x = interpolated-normal-x >> 20
normal-y = interpolated-normal-y >> 20
index = (v >> 16) << 8) + (u >> 16)
texel = texture[index]
bump-normal-x = bumpmap[index+1] - bumpmap[index - 1]
bump-normal-y = bumpmap[index+256 - bumpmap[index - 256]
p = 127 - (bump-normal-x - normal-x)
q = 127 - (bump-normal-y - normal-y)
if(p < 0) then p = 0
if(q < 0) then q = 0
colour = colourtable[texel][phongmap[p*256+q]]
putpixel(x, y, colour)
(and just interpolate normal + texture here...)
end
</FONT></PRE>
</TD></TR></TABLE>
</TD></TR>
</TABLE></CENTER>
<P>Quite a nice method, but perhaps the inner loop is a little complex.
<H3><FONT COLOR=YELLOW><I>#2: Paul Adams</I></FONT></H3>
<P>Next up is Paul (aka Frenzy). Well.. this guy lives in the same town as me, yet I still haven't been able to spot him... Paul, if
you're reading, show yourself... anyway back to the code. His suggestion is to have a 'heightfield' map (could be same map as
texture if working in monochrome, colour paletted images may freak out...). You then take:
<CENTER><P><TABLE WIDTH=65% CELLPADDING=0 CELLSPACING=0>
<TR><TD>
<TABLE><TR><TD>
<PRE><FONT COLOR=#FF0000 FACE=Courier SIZE=2>
nx = map[u-1] - map[u+1]
ny = map[v-1] - map[v+1]
Which sounds a little odd... I think he means...
nx = map[u-1] - map[u+1]
ny = map[v-256] - map[v+256]
</FONT></PRE>
</TD></TR></TABLE>
</TD></TR>
</TABLE></CENTER>
<P>Which would make a little more sense... Then just do the old ny*256+nx, to get the index into your phongmap. Not too bad..
<H3><FONT COLOR=YELLOW><I>#3: Jacco Bikker</I></FONT></H3>
<P>This is the third and final entry. I just chose 3 to keep it simple, a lot of stuff was duplicated. His idea revolves around the idea
of a relief map. This is an array of 8-bit bytes, broken up into 2 4-bit halfs. The upper 4 bits are filled with the X difference
between the pixels neighbours, and the lower 4 are filled with the Y difference. With 4 bits, we have a range of (he said) -7 to
+8 (I think its -8 to +7 though). You have to clamp to this range, to avoid problems later on...
<P>Next you have to create a 16x16 array. In this array, we interpolate a normal vector, I'd imagine this would be from (-0.5,
-0.5, 0) to (0.5, 0.5, 0). Now, don't store this as array[16][16], store it as array[256]. This is because we shall now index into
that array. And what do we use to index with? The value calculated in the paragraph above. Then, mix these values together
with lighting, and texture, and plot. Quite a complex system, I have to say.
<H3><FONT COLOR=YELLOW><I>Summary</I></FONT></H3>
<P>I have to say #2 is by far the simplest to code. It may also be the quickest, if when you find the nx and ny values you just clip
them to 8 bits (by storing them in a byte register) then we can speed it up nicely. It'll also fit quite nicely into common 256x256
mappers. Anyway, have a play with them, I'm sure you'll find this lot handy.
<P>OK, now if you want to send me something, then make it cells+portals this time, I've already had one reply (Jacco Bikker)
which was interesting, I'd like to hear other views on the subject. I have some ideas of my own on this (which are quite
complex, but sounds reasonable, to me at least...). Again, any tidbits or code samples will be nice, lets see what we can learn
about them.</p>
<!--Bottom Navigation-->
<A NAME="bottom"></A>
<!--End Bottom Navigation-->
</STRONG>
</FONT>
<!--End Body-->
<!--Bottom-->
<BR>
<IMG SRC="gradbar.jpg">
<BR>
<FONT SIZE=2 COLOR=#8B8B8B FACE=Helvetica>
<I><font color="#FBFBFB">T</font><font color="#F7F7F7">h</font><font color="#F3F3F3">e</font><font color="#EFEFEF"> </font><font color="#EBEBEB">G</font><font color="#E7E7E7">a</font><font color="#E3E3E3">m</font><font color="#DFDFDF">e</font><font color="#DBDBDB"> </font><font color="#D7D7D7">P</font><font color="#D3D3D3">r</font><font color="#CFCFCF">o</font><font color="#CBCBCB">g</font><font color="#C7C7C7">r</font><font color="#C3C3C3">a</font><font color="#BFBFBF">m</font><font color="#BBBBBB">m</font><font color="#B7B7B7">i</font><font color="#B3B3B3">n</font><font color="#AFAFAF">g</font><font color="#ABABAB"> </font><font color="#A7A7A7">M</font><font color="#A3A3A3">e</font><font color="#9F9F9F">g</font><font color="#9B9B9B">a</font><font color="#979797">S</font><font color="#939393">i</font><font color="#8F8F8F">t</font><font color="#8B8B8B">e</font> - ⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -