居中 UV 可视化
10 / 30
把居中 UV（vUv-0.5）可视化成颜色。
UV 坐标的原点在左下角。但画圆、做光晕、计算对称效果时，我们通常需要以画面中心为基准。
减去 0.5，原点移到中心
一行代码就够：
变换前后的对比：
| 位置 | vUv | p（变换后） |
|---|---|---|
| 左下角 | (0.0, 0.0) | (-0.5, -0.5) |
| 右上角 | (1.0, 1.0) | ( 0.5, 0.5) |
| 正中心 | (0.5, 0.5) | ( 0.0, 0.0) |
现在 p 的范围是 -0.5 到 0.5，中心是 (0, 0)。
可视化 p
p 里有负数，直接当颜色会被截断（颜色不能为负）。加回 0.5 就能正常显示：
这等价于原来的 UV 颜色图，只是思路变了——现在 p 描述的是"距中心的偏移"。
为什么重要
画圆形时，需要计算像素到中心的距离：
如果用原始 vUv，算出来是到左下角的距离，圆会偏到右上方。用 p = vUv - 0.5，圆才会在正中间。
练习
用 p = vUv - 0.5 构造居中坐标，再用 vec3(p + 0.5, 0.0) 输出颜色。
答案解析
p + 0.5 把范围从 -0.50.5 移回 01，才能当颜色用。
p.x + 0.5给红色通道 → 左边红色为 0，右边为 1p.y + 0.5给绿色通道 → 下边绿色为 0，上边为 1- 蓝色固定为 0
视觉上和 UV 颜色图一样，但现在你的坐标是以中心为原点的，后续画任何圆形、光晕都可以直接用 p。