数值 · 09
径向衰减
Radial falloff · radial-falloff离指针越近影响越强，出了半径就归零。
指针场若用硬圆形开关，圆边会突然跳变。径向衰减把距离转成连续权重，再把权重给大小、位移或亮度。指数越大，力量越集中在中心；半径决定有多少元素参与。
公式
w(d) = d ≥ R ? 0 : (1 − d/R)^p
参数
| 本页默认 | 成熟实现 | |
|---|---|---|
| radius R | 120 px | our motion-kit radialPush: radius × reach超出半径权重归零。 |
| exponent p | 2 | our motion-kit: quadratic一次衰减范围广，三次更靠中心。 |
怎样做好
- 先算距离再限半径，半径外直接返回 0，别让负底数遇到非整数指数。www-motion/rewrite/lib/motion-kit.js:178–182
- 把强度与方向分开计算；中心点方向不定时给一个备用方向。www-motion/rewrite/lib/motion-kit.js:183–187
- 用半径控制参与数量，用指数控制边缘柔和度，不要只靠放大最终位移调手感。
在我们的案例里
19 个案例用径向衰减。站内 motion-kit 的 radialPush 用二次强度 (1−d/R)² 推开点位，并处理指针恰在中心时方向无法计算的情况；这是点阵交互里容易漏掉的边界。
出现在 19 个案例
参考实现 · basics.js
/** Influence of a point at distance d from a source of radius R: 1 at the centre, 0 at R. */
export const radialFalloff = (d, radius, exponent = 2) => (d >= radius ? 0 : (1 - d / radius) ** exponent);
/** Influence of one pointer on many elements; returns 0..1 per element. */
export const field = (points, px, py, radius, exponent = 2) =>
points.map(p => radialFalloff(Math.hypot(p.x - px, p.y - py), radius, exponent));