Warp Starfield 星空穿梭
Every star has a depth value, and dividing its position by that depth is the entire perspective camera. 每颗星带一个深度值,位置除以深度——这就是完整的透视相机。
Runs live on this page. Move the pointer, click, or drag — whichever the effect listens for. 就在本页实时运行。移动鼠标、点击或拖拽——看它响应哪一种。
How it works原理拆解
Stars store an offset from centre plus a z between 0.1 and 2. The screen position is cx + x/z, so halving z doubles the distance from centre — that is genuine perspective divide, not a scaling animation. When z drifts below zero the star respawns at z=2, which is why the field never empties. 星星存的是相对中心的偏移量和一个 0.1–2 之间的 z。屏幕坐标是 cx + x/z,所以 z 减半、离中心距离就翻倍,这是真正的透视除法,不是放大动画。z 掉到 0 以下就在 z=2 重生,所以星空永远不会空。
What to change可以改的地方
- 1Increase the z decrement for a faster warp speed.
- 2Draw a short line from the previous position to the current one for motion streaks instead of dots.
- 1加大每帧的 z 递减量,跃迁速度立刻变快。
- 2从上一帧位置到当前位置画一条短线,点就变成速度线。
Source code源码
Self-contained — paste it into any HTML file and it runs. No libraries. 完全独立——粘进任意 HTML 文件就能跑,不需要任何库。