山河木马

混合测试，Blending 很多人第一次接触透明效果时，都会碰到这些困惑： 为什么设置了 alpha，物体却没有变透明 gl.enable(gl.BLEND) 一开，到底发生了什么 新颜色到底是怎么和

深度测试 前面的专题里，我们已经讲过： 裁剪 透视除法 NDC 视口变换 光栅化 裁切测试 模板测试 这一篇终于来到 3D 渲染里一个真正绕不开的主题： 如果你刚接触 WebGL，几乎一定遇到过这些问

圆形遮罩 先别背 API 如果你是第一次学模板测试，我建议先不要急着记： gl.colorMask gl.stencilMask gl.stencilFunc gl.stencilOp 因为一上来就

裁切测试 前面的专题里，我们已经一路讲过： 裁剪，Clipping 透视除法 NDC 视口变换 光栅化 到了这里，很多人会在 WebGL API 里又看到一个名字很像的东西： 这时候就很容易懵： 这个

核心定义 光栅化，Rasterization，就是把“几何图元”变成“屏幕上的片元”的过程。 更直白一点说： 前面阶段处理的是点、线、三角形这种几何对象 光栅化处理的是“这个三角形到底覆盖了哪些屏幕位

--- theme: v-green highlight: vs2015 --- # 核心结论 - `NDC` 变成屏幕像素坐标，本质上就是做一次`视口变换`，`Viewport Transform

核心定义 NDC，Normalized Device Coordinates，中文一般叫标准化设备坐标。 它是 GPU 在裁剪空间之后、屏幕坐标之前的一个中间坐标空间。 你可以把它理解成：GPU 把所

裁剪到底在裁什么 学 WebGL 3D 的时候，很多人都会反复看到一个词： 裁剪。 教程里经常会说： 顶点先进入裁剪空间 GPU 会做裁剪 裁剪之后再做透视除法 但很多人其实并没有真正搞明白： 裁剪到

核心结论 计算出 gl_FragColor 之后，并不代表这个颜色一定会显示到屏幕上。 GPU 后面还会经过一串逐片元操作，Per-Fragment Operations，只有通过这些步骤，这个片元才