Remap 函数
4 / 18
实现 remap() 辅助函数，用于区间映射。
remap 把一个值从一个数值范围线性映射到另一个范围，用它把 vUv.x 从 [0,1] 映射到 [-1,1]，就能做出从边缘到中心的对称渐变：
下面拆解每一步的含义。
remap 是什么
把一个已知范围内的值线性转换到新范围，公式如下：
第一行求出 v 在原区间里的比例（0% 到 100%），第二行把这个比例映射到目标区间。
例如 remap(0.25, 0.0, 1.0, -1.0, 1.0) → 0.25 在 [0,1] 里是 25%，放进 [-1,1] 是 -0.5。
取绝对值产生 V 形
remap(vUv.x, 0.0, 1.0, -1.0, 1.0) 把 x 坐标从 [0,1] 变成 [-1,1]：
- 左边缘 x=0 → t=-1
- 画面中心 x=0.5 → t=0
- 右边缘 x=1 → t=1
取 abs(t) 后：
- 左右两边缘 → 1（100%）
- 画面中心 → 0（0%）
这就是一个 V 形，从中心向两边增大。
用 mix 上色
mix(蓝色, 粉色, t) 按照 t 在两种颜色间插值：t=0 是蓝色（中心），t=1 是粉色（两边）。结果是一个从中心蓝色向两侧粉色扩散的对称渐变。
试着改一改
| 改动 | 效果 |
|---|---|
把输出范围改为 0.0, 2.0 | t 超出 [0,1]，中心变色但不再到达粉色 |
去掉 abs，不取绝对值 | 渐变不对称，从左粉到右蓝 |
把 vUv.x 换成 vUv.y | 渐变变成纵向 |
把两个 mix 颜色都改成暖色 | 橙色到红色的渐变 |
练习
练习代码中 remap 函数已经定义好，但 t 还没有计算。用 remap 把 vUv.x 从 [0,1] 映射到 [-1,1]，再取绝对值，让画面呈现从蓝到粉的对称渐变。
答案解析
起始代码 t = 0.0，画面全是蓝色（mix 的第一个参数）。
remap(vUv.x, 0.0, 1.0, -1.0, 1.0) 把 x 坐标从 [0,1] 线性拉伸到 [-1,1]。abs(t) 把 [-1,0] 翻折到 [0,1]，让左右对称：中心 t=0 是蓝色，两边 t=1 是粉色。
试着把 abs(t) 改为 t * t，用平方代替绝对值，渐变会有不同的曲线形状。