AI 参与说明（Agent：Grok、Codex）：原始 demo 来自 Grok 工作区；Codex 根据提供的源码完成站点集成、交互修正与本页说明。本文描述该 demo 的具体行为，整理于 2026-09-10。Codex 运行记录：模型
gpt-6-astra，reasoning effortlow，执行入口 Codex Desktop；原始 Grok 的模型与 reasoning effort 未取得运行记录。
关联阅读补充（2026-09-10，Agent：Codex）：加入 Orbit 与 Agent Harness 经验分析入口。模型
gpt-6-astra，reasoning effortultra，执行入口 Codex Desktop。
可交互演示页尚未发布到 /demos/2026/infinite-coast/。 先读本页实现说明，或从 Labs 看现有演示。
画面铺满整个窗口，控件放在底部。先点击「海马谷」或「螺旋」，再沿着边缘放大，观察层层展开的分形图案。
| 英文术语 | 中文名称 | 简要解释 |
|---|---|---|
| Mandelbrot set | 曼德勃罗集合 | 本演示探索的分形对象 |
| WebGL | 网页图形接口 | 本演示用来运行图形着色器、绘制画布的浏览器接口 |
| Re / Im | 实部 / 虚部 | 右上角显示的当前视图中心坐标 |
怎么玩
| 操作 | 效果 |
|---|---|
| 点击画布 | 围绕点击位置放大 |
| 拖动画布 | 平移视图 |
| 滚轮或双指捏合 | 围绕指针或双指中心缩放 |
| 右键或 Shift+点击 | 缩小 |
| 底部 − / + | 围绕画面中心缩小或放大 |
| 迭代滑杆 | 手动调整细节计算次数，同时关闭自适应 |
| 自适应 | 随缩放自动调整迭代次数 |
| 重置 | 回到全景并打开自适应，保留当前配色 |
还可以使用键盘：数字 1–8 选择对应位置，0 重置，P 切换配色，方向键平移，+ / − 缩放。操作说明按钮可以展开或收起帮助。键盘焦点位于控件上时，优先保留控件自身的键盘操作。
八个位置，五种配色
位置按控件顺序排列：全景、海马谷、象谷、螺旋、迷你、星鱼、触须、针尖。窄屏上的位置按钮可以横向滚动。
配色为 海岸、墨海、冰川、余烬、银盐。切换配色不会改变坐标，可以留在同一位置比较不同颜色下的纹理。
建议先按以下顺序体验：
- 点击「海马谷」，观察细丝和螺旋交错的位置。
- 点击一个边缘放大，再拖动画面追踪附近的图案。
- 切换「冰川」或「余烬」，比较同一区域的色彩层次。
- 手动增加迭代次数，观察边缘变化；重新打开自适应后继续探索。
- 点击「重置」回到全景，再试试「螺旋」和「迷你」。
画质与边界
The demo uses WebGL shaders and finite iteration limits. 本演示通过 WebGL 着色器绘制图案，迭代范围是 64–1024。拖动和缩放期间会暂时降低画布采样分辨率，并将迭代次数限制在最多 160；停止交互后恢复设定的迭代次数，画布像素比例最高为 2。
因此，移动中短暂模糊或细节减少是这个 demo 的性能取舍。停下来后再判断边缘是否清晰。增加迭代次数可能揭示更多细节，也会增加计算量。
「无穷」是探索意象，不代表可以无限精确放大。当前实现使用有限浮点精度；深度放大时会显示精度提示，继续放大可能出现块状纹理。增加迭代次数无法消除坐标精度限制。
浏览器需要启用 JavaScript 和 WebGL。无法初始化图形接口或图形上下文丢失时，页面会显示错误信息。演示在当前浏览器的本地存储中保存视图、配色和迭代设置，重新打开时恢复；浏览器禁止存储时仍可以操作，但不会保存。
源码与关联阅读
- Orbit：轨道重力实验室：放置天体、抛出行星，观察另一种交互模拟。
- 从两个 Grok Build Demo 学习 Agent Harness：分析两个演示的复用边界、交互架构与验证方法。
上述操作与数值以本文描述的当前实现为准；待演示页并入站点后再与页面行为交叉核验。
- 前端工具链专题
- Three.js 与 Blender 入门：继续体验可以旋转、换形状和调整灯光的 3D 场景。