GLSL 内置函数
distance()
返回两个点之间的距离，等于 length(p0 - p1)。
函数签名
float distance(float p0, float p1)
float distance(vec2 p0, vec2 p1)
float distance(vec3 p0, vec3 p1)参数
- p0
- 第一个点。
- p1
- 第二个点。
返回值
一个大于等于 0 的浮点数。
在线示例
修改右侧代码，左侧预览会实时更新。
工作原理
distance(a, b) 告诉你两个点相距多远。它和 length(a - b) 完全相同，哪个读起来清楚就用哪个。
float d = distance(uv, vec2(0.5)); // 到画布中心的距离
示例中，每个像素都测量自己到三个移动点的距离，并用 min 保留最小的那个。在这个值上画等高线，就能看到一组圆，在点彼此靠近的地方融合，这是 Voronoi 距离场的简单形式。
常见用法
- 以任意点为圆心画圆：
step(distance(uv, center), radius)。 - 多个点的距离场：示例中的最近点图案，是细胞噪声的基础。
- 鼠标交互：用
distance(uv, mouse)高亮鼠标附近的区域。
常见错误
- 坐标空间不一致。
uv在 0 到 1 之间，而点却以像素为单位，这样算出的距离没有意义。先把两者换算到同一空间。 - 忽略宽高比。在宽画布上，同样的距离在水平方向覆盖更多像素，圆会变成椭圆。