图形学中的抗锯齿讨论以及在unity中的应用

news2025/1/19 16:57:23

抗锯齿(Anti-Aliasing)是图形学中，很重要的一个部分。本文旨在做一些分析总结，并对平时不理解的细节，做了调研总结，但毕竟不是做GPU行家，所以有不对的地方，欢迎拍砖^^。

1 什么是锯齿

下图，是一个在unity中，不开启抗锯齿的情况下的渲染效果，可以看到，边沿区域，例如黄色块的边沿，有非常明显的锯齿效果。
锯齿指的是徐

接着，我启用了抗锯齿功能（URP设置里，有个Anti Aliasing），渲染效果如下，边沿区域，有一些过度颜色，不会那么生硬的，要么黄，要么灰了！
在这里插入图片描述

2 锯齿原因

原因是：光栅化阶段，执行片元着色器时，采色要么采A色，要么采B色。例如上面的黄色区域，采样时，要么就黄色，要么就某种灰色了。所以边界区域，颜色变化比较剧烈，看起来像锯齿。

再回溯一下，光栅化阶段，最重要2个部分（更多请参考 GPU 渲染管线与着色器大白话总结）：
三角形设置与遍历 + 片元着色器。

三角形设置与遍历，简单的说，是找出所有三角形都覆盖哪些像素，然后生成对应的片元。具体而言，是判断像素的中心点，是否在三角形内。判断方法，请参考叉乘在图形学中的几何意义 ---- 判断一个点是否在三角形内。如果在三角形内，就生成一个片元。

当然了，肯定存在不同三角形对应同一个屏幕像素，那对应的2个片元，其深度值z不一样。z值最小的，在最上面，z值大的片元，在下面，如果上面没有透明色，那下面的片元，就不需要执行片元着色器了。

anyway，有效的片元，总归要执行片元着色器（fragment shader，又叫pixel shader），对该片元着色。着色后，对于一些边界区域，颜色变化如果很大，就会看起来有锯齿。

例如下图，根据像素中心是否在三角形内的原则，采样后的三角形，如下，锯齿非常明显。
在这里插入图片描述

3 抗锯齿的方法

抗锯齿的目标，就是让颜色剧烈变化的像素区域，有一些过度色，不那么生硬！

在图形学中，有几种主流的抗锯齿方法，常用的包括：

超级采样抗锯齿（Super-Sample Anti-Aliasing，SSAA）：
- 渲染管线阶段：光栅化阶段。
- 简要介绍：SSAA在渲染过程中使用比实际屏幕分辨率更高的分辨率进行渲染，然后再将图像缩小到目标分辨率。这样做会导致在渲染过程中对于每个像素执行更多次的片元着色器，从而获得更平滑的图像。
- 特点：消耗性能。
多重采样抗锯齿（Multisample Anti-Aliasing，MSAA）：
- 渲染管线阶段：光栅化阶段。
- 简要介绍：对SSAA的优化，在每个像素位置进行多次采样，然后根据采样结果进行平均。
- 特点：比SSAA好一些。
快速近似抗锯齿（Fast Approximate Anti-Aliasing，FXAA）：
- 渲染管线阶段：后期处理阶段。
- 简要介绍：不管什么三角形了，只关心最终图像。通过对图像进行分析，检测锯齿和边缘走样，并应用特定的滤波器来减少锯齿效果。FXAA是一种快速而低成本的抗锯齿技术，但可能会导致细节损失和模糊。优点：节约性能。
- 特点：最节约性能。
子像素采样抗锯齿(Subpixel Morphological AA， SMAA):
- 渲染管线阶段：后期处理阶段。
- 简要介绍：都是对像素左侧和上侧的边进行边缘检测，但又考虑了局部的像素对比，提取更多几何信息，保留不该模糊的边缘。
帧间抗锯齿(Temporal AA， TAA)
- 渲染管线阶段：后期处理阶段。
- 简要介绍：通过加权混合相邻多帧达到抗锯齿效果，从理论上解释就是将计算量分摊（Amortized）至多帧的超采样

下文对一些抗锯齿方法做一些详细介绍。

3.1 SSAA简介

既然叫超采样，顾名思义，就是增加采样点了。
一个像素本来采1个中心点，现在采N个：
在这里插入图片描述

例如上面的最左边像素，本来像素中心不在三角形内，就没颜色。现在像素内取4个点采，就有1个子采样点，在三角形内了。

实际落地办法，先弄个虚拟的输出画面buffer，分辨率是最终输出画面的N倍，例如4个采样点，就提高2倍。然后渲染到该buffer上。然后，再同比缩小到实际输出画面上。
在这里插入图片描述
缩小后，一个实际像素的颜色，会取4个子采样点的像素的平均值。
所以，实际效果会这样：

在边沿区域，有了较好的过度色。例如最左下方，本来没颜色，现在color = 1/4 * yellow_color，有了一些过度了。