3 纹理样式集.docVIP

GameRes游戏开发资源网 栅格地形渲染 张嘉华 (Email：newzjh@126.com，QQ：188318005，blog：/javazjh) 华南理工大学计算机学院 摘要：本文专门探讨了适合战棋类(SLG)游戏的三维地形栅格化渲染策略。 图1：栅格地形效果 1 框架 　　图2是一个栅格（tile）的定义，栅格的纹理样式和颜色都定义在中心采样点上，对于输入256×256的原始地形，就有256×256个栅格，对于每个栅格由四个子区域(sub rect)组成。每个子区域由4个顶点构成，由于每个子区域每层的纹理坐标有差别，后文会详细介绍原因，因此不采用Shader难以实现每个栅格只采用3×3个顶点，因此，先介绍每个子区域2×2个顶点，共2×2×4=16个顶点。对于一个256×256原始采样点的图来说，那么就需要256×256×16个顶点，比普通的只贴一层纹理的顶点刚好多了16倍顶点数量。 图2：1个栅格(Tile)的定义 2. 纹理融合 为了实现栅格间的纹理融合，下面来推导栅格上每个顶点的纹理比例。对于浅黄色子区域（8-9-10-11），参见图3，实质上是采样点A-B-D-E所构成的区域的右下角，因此顶点9的纹理为t9=(A+B+D+E)/4，Wi为四维向量，分别代表影响该子区域的四种类型纹理的权重，其分量顺序对应每个子区域的纹理样式编码，均为左下，左上，右下，右上，实际编码将在后文讨论，类似可以得到下面的： 图3：某个栅格与其邻接栅格示意图  为了在GPU能自动计算上述式子，我们作进一步推导，假设栅格坐标如图4，栅格内顶点像素范围取值从-0.5至0.5，取u1=floor(u)，u2=ceil(u)，v1=floor(v)，v2=ceil(v)，那么对于栅格内任意一个像素，影响其的四个栅格（采样点）分别为（i+u1，j+v1），（i+u2，j+v1），（i+u1，j+v2），（i+u2，j+v2），对于如图4，假设像素处于右下角子区域，那么则u1=0，u2=1，v1=-1，v2=0，影响它的四个栅格，也就是提供它融合权重的四个采样点分别为（i+0，j-1），（i+1，j-1），（i+0，j+0），（i+1，j+0）。接着计算混合比例u’=fmod(u，1.0f)，v’=fmod(v，1.0f)，即对1.0求浮点模，那么栅格内任意点(u，v)的颜色和比例可以通过如下双线性插值计算得到： 具体实现时，颜色的双线性插值可以由GPU完成，计算好每个顶点的颜色即可，纹理的双线性插值由于需要根据不同纹理坐标采样了再进行插值，因此可以在Vertex Shader根据顶点在栅格内坐标计算四个层次的纹理坐标，在Pixel Shader对四个纹理层次进行纹理采样（Sample），然后对双线性插值公式得到的权重进行组合得到纹理颜色。 图4：逐像素纹理混合  3. 纹理样式集 为了减少纹理上下文的切换，上文所设计的顶点组织方案适合把各种样图纹理组合到一张大的纹理集上，本文采用2048×2048的大纹理作为纹理集来存放16×16=256张样式纹理，图4是一张16×16组合的纹理集。每个样式图纹理大小为64×64个像素。 图4：16×16纹理集组合 4. 顶点定义 下面定义具体的每个顶点结构： struct GTileVertex { public: float3 position;//位置 float3 normal; //法向量 DWORD color0; //颜色 float2 xy; //栅格内的单位化位置比例，TexCoord0 float2 uv0; //第0种纹理的坐标，TexCoord1 float2 uv1; //第1种纹理的坐标，TexCoord2 float2 uv2; //第2种纹理的坐标，TexCoord3 float2 uv3; //第3种纹理的坐标，TexCoord4 float4 weight; //上面四种纹理在该顶点的权重，TexCoord5 };  设E采样点(ix,iy)对应的栅格纹理为texture(ix,iy)，颜色为color(ix,iy)，则E栅格左下角区域0-3顶点的值如下： V0.color0=(color(ix，iy)+color(ix-1，iy)+color(ix，iy-1)+color(ix-1，iy-1))/4; V0.xy=(0.0f，0.0f) V0.uv0=texture(ix-1，iy-1)在0点的纹理坐标 V0.uv1=texture(ix-1，iy)在0点的纹理坐标 V0.uv2=texture(ix，iy-1)在0点的纹理坐标 V0.uv3=texture(ix，iy)在0点的纹理坐