3D 模式:猫是带 36 根骨骼的低多边形模型,实时蒙皮渲染。
左键拖动 = 旋转视角,滚轮 = 缩放;
鼠标移到地面 蓝点 上 = 牵引猫走过去;
←/→ 推动猫,Space 坐下,P 扑击。
全程离线渲染,无任何外部 API 调用。
3D 渲染管线
- 模型:glTF 低多边形猫,约 1800 顶点 / 2600 面 / 36 骨骼
- 蒙皮:SkinnedMesh + Skeleton,逐帧写入骨骼旋转后实时蒙皮
- 步态:对角步态(前左+后右 / 前右+后左 反相),膝盖只向后弯
- 地面网格:1 单位网格烘焙进 canvas 贴图,靠 mipmap 抗锯齿
- 光照:HemisphereLight + DirectionalLight 投射阴影
- 相机:PerspectiveCamera + 手写轨道控制(拖拽旋转 / 滚轮缩放)
参数 全部 HEURISTIC
| 参数 | 值 |
| 猫高 | 3.0 单位 |
| 猫体长 | ~3.6 单位 |
| 牵引绳长 | 1.55 体长 |
| 步态相位差 | π(对角反相) |
| 尾巴摆幅 | 22° |
| 速度上限 | 1.4 体长/秒 |
| 静止坐下 | 5 秒后 |
对应 §8 外设总线 PER/LEASH 分类。
Three.js r160 本地加载(assets/vendor/three.module.min.js),无任何 CDN 依赖。
猫模型为 Toon Cat(Omabuarts Studio,CC-BY 4.0),已清理为单网格 + 36 骨骼。
HEURISTIC = 行为学里没有这个数的明确定量。