阶梯值(量化)

14 / 30
使用 floor() 将连续渐变量化成离散阶梯。

渐变是连续的。用 floor 可以把连续的渐变量化成离散的阶梯——像调色盘一样,只有有限几种颜色。


floor 量化

  • vUv.x * 6.0 把 01 拉伸到 06
  • floor(...) 取整:得到 0, 1, 2, 3, 4, 5 这六个整数
  • 除以 steps - 1.0 = 5.0:把 05 归一化回 01

结果:t 只有 6 个值(0, 0.2, 0.4, 0.6, 0.8, 1.0),每个值对应一条色带。


练习

练习代码里 t = 0.0(全是颜色 a)。用 floor(vUv.x * steps) / (steps - 1.0) 计算量化后的 t,让颜色渐变变成 6 个阶梯。

答案解析

floor 把连续值「锁定」到整数——相邻像素只要落在同一个整数区间,就输出完全一样的颜色。除以 (steps - 1.0) 而不是 steps,是为了让最后一阶恰好等于 1.0(最右端是颜色 b)。

改变 steps = 3.0 得到粗粒度的 3 档色阶,steps = 16.0 接近连续渐变。

GLSL 代码编辑器

正确代码预览

当前代码预览