WebGL 深度测试详解#

#WebGL 深度测试详解

预计阅读时间: 7 分钟

#1. 深度测试基础

#1.1 深度测试是什么？

#1.2 深度测试机制

#1.2 深度缓冲控制

可以通过以下方式控制深度缓冲的行为：

1. 只读深度缓冲：

   • 对所有片段执行深度测试
   • 但不更新深度缓冲
   • 通过设置深度掩码（Depth Mask）为 GL_FALSE 实现

2. 提前深度测试：

#2. 深度精度

#2.1 精度特性

实际上在应用投影矩阵后，会把深度值做一个非线性变换，与距离成反比

$$F_{\text{depth}} = \frac{1/z - 1/\text{near}}{1/\text{far} - 1/\text{near}}$$

深度缓冲中0.5的值并不代表着物体的z值是位于平截头体的中间了，这个顶点的z值实际上非常接近近平面,z值分布图如下

可以看到，深度值很大一部分是由很小的z值所决定的，这给了近处的物体很大的深度精度

#2.2 深度冲突（Z-fighting）

#解决方案

1. 物体间距控制

   • 避免将面过于靠近
   • 设置细微的间距差异（人眼无法察觉）

2. 近平面调整

   • 在不影响视觉效果的前提下，尽可能远离观察者
   • 利用深度缓冲在近平面附近精度较高的特性

3. 提升深度精度

   • 可以从默认的 24 位提升到 32 位
   • 注意：会影响性能

#3. 渲染流程中的深度处理

#深度测试与深度缓冲写入

深度测试通过与否，以及深度缓冲写入与否，是两个不同的概念，容易混淆，这里需要澄清一下：

1. 深度测试：决定片段是否可以写入颜色缓冲
2. 深度缓冲写入：决定是否更新深度缓冲

#关闭深度缓冲写入的场景

1. 在3D场景中，如果需要绘制大量不透明物体，关闭深度缓冲写入可以提高渲染效率
2. 在立方体贴图渲染中，关闭深度缓冲写入可以提高渲染效率 立方体贴图渲染