2
0

08着色(着色频率、图形管线、纹理映射)

2026-08-27
2026-08-27

着色频率

07 着色(光照与基本着色模型)中提到Ping Point的概念,但并没有具体说是谁的法线向量,这就是着色频率的工作。

着色频率

上图分别对于的是三角形法线,点法线,像素法线不同着色带来的效果

平面着色 Flat Shading

  • 即三角形为单位的着色

Flat Shading,求每个面的法向量并着色。
Flat Shading计算快,但效果不好。

定义逐平面法线向量:

三角形中三条边做叉乘

顶点着色Gouraud Shading

Gouraud Shading,求每个顶点法线并着色,三角形内部颜色值插值。

定义顶点法线方向

  • 首先获取顶点附近的三角形面

  • 然后获取每个三角形面的法线,将其相加之后做一个加权

  • 其中加权数是三角形的面积

像素着色Phong Shading

Phong Shading,求每个像素法线并着色。
Phong Shading,效果好但开销大。

定义逐像素法线:

重心插值法

三种着色频率的对比

  • 对于三种不同的方法,其实在某些程度上会达到一致的效果
  • 当模型的面数足够多的时候,其实所需的频率可以越少,某种程度上是,频率其实是守差不多的,只是看问题角度变了

图形渲染管线

顶点处理

顶点处理的作用是对所有顶点数据进行MVP变换,最终得到投影到二维平面的坐标信息(同时为了Zbuffer保留深度z值)。超出观察空间的会被剪裁掉。

三角形阶段

三角形处理十分容易理解,就是将所有的顶点按照原几何信息,变成三角面,每个面由3个顶点组成。

在程序上,是将一系列的点转换为数组的,输入给计算机,然后通过每三点一个三角形,将其在程序上记录起来

光栅化

于是就得到了许许多多个三角形之后,接下来的操作自然就是三角形光栅化了。

片元阶段

  • 在进行完三角形的光栅化之后,知道了哪些在三角形内的点可以被显示,那么如何确定每个像素点或者说片元(Fragement)的颜色呢?[注:片元可能比像素更小,如MSAA抗拒齿操作的进一步细分得到的采样点]。那自然就是着色了,也就是片元处理阶段应该做的。
  • 注意这阶段顶点处理也亮起来是因为我们需要顶点信息对三角形内的点进行属性插值(tips:当然也可以直接在顶点处理阶段就算出每个顶点的颜色值,如Gouraud Shading一样)。当然这一阶段也少不了Z-Buffer来帮助确定,哪些像素点应该显示在屏幕上,哪些点被遮挡了不应该显示
    片元处理中,还有纹理映射的步骤。
  • 纹理映射其实是对模型颜色的映射,我们知道又三角形着色,着什么颜色呢,这取决于纹理,纹理告诉我们要上什么颜色

Framebuffer处理

将所有的像素颜色信息整合在一起,输送给显示设备加以显示。这也就完成了整个图形渲染管线了。

Shader与GPU

Shader

  • 能在硬件上执行的语言
  • 每个顶点/像素执行一次(不用for循环)
  • 顶点的操作→顶点着色器vertex shader
  • 像素的操作→片元着色器fragment shader

例:
GLSL例子

GPU

  • 独显/核显
  • gpu可以理解成高度并行化的处理器(核心数量理解为并行线程的数量)
  • gpu并行度惊人,远超过cpu

纹理映射

纹理映射定义任意点的不同属性,让同一个光照模型下点的颜色不同。

纹理(Texture)

物体的表面是2D的,也就是说可以将三维物体上的任意一个点都映射到一个2维平面之上。
例:地球仪

倘若拥有从3维World space到2维Texture space的一个映射关系,那么只需要将每个点的颜色信息即漫反射系数存储在2维的Texture之上,每次利用光照模型进行计算的时候根据映射关系就能查到这个点的漫反射系数是多少,所有点计算完之后,结果就像最左边的screen space之中,整个Texture被贴在了模型之上。

例:独眼怪

纹理坐标UV

纹理坐标UV表示Texture的映射关系。
  • U/V范围一般[0,1]

纹理坐标伪代码:

简而言之就是对每个光栅化的屏幕坐标算出它的uv坐标(利用三角形顶点重心坐标插值),再利用这个uv坐标去查询texture上的颜色,把这个颜色信息当作漫反射系数Kd。

一个点/像素 →(通过重心坐标插值)uv → 查询找到对应texcolor代替kd

特殊纹理tile

tile纹理有上下左右重复拼接都是连续的特性,多用在贴在墙面或地板上。

例:

评论