哈希格点噪声
1 / 15
使用简单哈希函数，为每个网格单元生成随机值。
把画面切成 64×64 的格子，每格一个随机灰度，核心就是这两行：
下面拆解它。
hash21 是什么
hash21 是一个"伪随机函数"——给它一个二维坐标，它返回一个 0.0 到 1.0 之间的数。
关键词是伪随机：它不是真正随机的，相同的输入永远返回相同的输出。这正是我们需要的——同一个格子在每次渲染时应该是同一个颜色，不能每帧闪烁。
你不需要记忆这些数字，把它当作工具直接用就行。
floor 的作用
vUv 是 0.0 到 1.0 的连续坐标。用 floor(vUv * 64.0) 之后：
- 乘以 64 把坐标放大到 0.0–64.0
floor砍掉小数，只保留整数：0, 1, 2 ... 63
同一格内所有像素的 floor 结果相同，传给 hash21 得到同一个随机值，整格变成同一颜色。系数越小格子越大，系数越大格子越细。
试着改一改
| 改动 | 效果 |
|---|---|
64.0 改成 8.0 | 格子变大，马赛克感更明显 |
64.0 改成 256.0 | 格子极小，像真正的随机噪点 |
vec3(n) 改成 vec3(n, n*0.5, 0.2) | 每格变成黄橙色调 |
34.345 改成 12.0 | 随机分布发生变化，视觉结构相似 |
练习
在 main 函数里用 hash21(floor(vUv * 64.0)) 计算格点随机值，并将它输出为灰度图。
答案解析
关键改动只有一行：把 n = 0.0 替换成 n = hash21(floor(vUv * 64.0))。
vUv * 64.0：把 UV 放大，决定格子密度floor(...)：把同一格内所有像素压到同一个整数坐标hash21(...)：对这个整数坐标取伪随机值，得到 0–1 的灰度vec3(n)：把单个浮点数扩展成灰度颜色
初始代码 n = 0.0 让所有像素都是黑色。替换之后每个格子拿到属于自己的随机数，画面就变成马赛克噪声。
试着把 64.0 改成 16.0，感受格子大小和噪声粗细的关系。