从 Local 到 World

同一个顶点在不同坐标空间里有不同的数值。本节我们把“世界坐标”直接映射成颜色，帮助你建立一个重要直觉：物体移动/旋转时，局部坐标不变，但世界坐标会变。

目标

• 分清常见坐标空间：Local（模型）/ World（世界）/ View（相机）/ Clip（裁剪）
• 在顶点着色器中使用 modelMatrix 把局部坐标变换到世界坐标
• 通过颜色可视化世界坐标的变化

思路

在顶点着色器中：

vec4 world = modelMatrix * vec4(position, 1.0);
vWorldPosition = world.xyz;
gl_Position = projectionMatrix * viewMatrix * world;

要点是两件事：

1. modelMatrix 把局部坐标变成世界坐标。
2. 再把世界坐标乘以 viewMatrix 与 projectionMatrix，得到 gl_Position。

在片元着色器中，我们把 vWorldPosition 映射到 [0,1] 作为 RGB 输出（这是“调试可视化”中非常常用的技巧）。

动手练习

• 改变 uRange，观察颜色映射的对比度变化
• 去掉物体的旋转（注释 update 的旋转代码），观察颜色是否还变化
• 尝试改成使用局部坐标 position 上色，并对比两者差异

小结

坐标空间是理解 3D 渲染的“地基”。下一节我们将创建自定义 attribute，让你开始掌控“每个顶点自己的数据”。