depWrite 深度写入
https://threejs.org/docs/?q=GridHelper#Material.depthWrite
官方文档是这样解释的(机翻):
.depthWrite : boolean
渲染此材质是否会对 深度缓冲产生任何影响。
绘制 2D 叠加层时，禁用深度写入功能可以方便地将多个对象分层放置，而不会产生 z-index 伪影。
默认值为true。
深度缓冲(Depth Buffer) 是什么?
- 和屏幕分辨率一样大的二维数组 屏幕: 1920 * 1080 深度缓冲: 1920 * 1080 每个像素一个 depth值
- depth值代表什么? 表示这个屏幕像素位置中, 已经画过的内容中, 离摄像机最近的是谁
换成人话来说: depthBuffer就是 像素点渲染内容的备忘录, 记录的是渲染内容距离摄像机有多远
如果将值指定为false 那么在渲染物体像素的时候, 则不会将这个距离, 记录到备忘录中
depthTest 深度测试
https://threejs.org/docs/?q=GridHelper#Material.depthTest
官方文档是这样解释的:
.depthTest : boolean
是否在渲染此材质时启用深度测试。如果禁用深度测试，深度写入功能也会被隐式禁用。
默认值为true。
上面我们说过了, 在渲染物体像素的时候, 默认会将物体像素距离摄像的位置记录到备忘录(depth Buffer)中 而depthTest 的作用, 就是决定渲染物体像素的时候, 要不要去depth buffer中判断远近
举例说明:
- 当前场景中已经有物体A, 记录了物体像素的depth为0.6, 即距离相机有0.6的距离
- 现在要画物体B, 物体B的形状与物体A完全相同, 只是画的位置, 要比物体更靠后, 他的depth 是0.8
- 那么在物体B 去Depth Buffer中比对的时候, 会发现当前位置已经被物体A占了 并且物体A距离摄像机更近 这个物体B就不画了, 这就是视觉上的遮盖的效果
上面的举例只是帮助理解, 实际记录会将顶点拆分成一个个像素片元
3D 顶点
→ 投影到屏幕
→ 拆成一堆像素片元（fragment）
→ 对每一个片元做深度测试
深度缓冲里存的是:
“屏幕 (x, y) 这个像素，现在最前面是谁”
因为并不是将Mesh作为一个整体存的, 所以会出现这种现象:
- 同一个物体:
- 一部分挡住别人
- 一部分被别人挡住
- 两个物体互相"咬"在一起 这都是 片元级比较 的结果
