“给任何人 30 行 JavaScript，他就能在浏览器里种下一朵会参数化开花的玫瑰，再点一下 Export，SVG 直接飞进 AxiDraw。”—— 这就是 Turtletoy 的魔法。
1. 30 行玫瑰：从 0 到可运行
打开 turtletoy.net/turtle/new，清空编辑器，把下面 30 行粘进去，点 Run：
// 可调节变量——下一节解释
const petals = 7; // min=3 max=13 step=1
const step = 2; // min=0.5 max=5 step=0.5
const k = 0.8; // min=0.1 max=1 step=0.1
const turtle = new Turtle();
turtle.penup();
turtle.goto(0, -40);
turtle.pendown();
function walk(i) {
const t = i * step;
const r = 40 * Math.cos(petals * t * Math.PI / 180);
const x = r * Math.cos(t * Math.PI / 180) * k;
const y = r * Math.sin(t * Math.PI / 180);
turtle.goto(x, y);
return i < 360 / step;
}
画布立刻出现一朵极坐标玫瑰。代码里没有任何魔法：
new Turtle()给你一只原点朝上的海龟；penup / pendown控制落笔；walk(i)是 Turtletoy 的执行引擎 —— 它会被反复调用，直到返回false，每次i+1，约 16 ms 刷新一次，天然动画。
2. 把变量变成滑杆：3 秒暴露参数
想让观众自己 “调花”？把注释改成指定格式即可：
const petals = 7; // min=3 max=13 step=1 花瓣数
const step = 2; // min=0.5 max=5 step=0.5 步长(密度)
const k = 0.8; // min=0.1 max=1 step=0.1 扁率
保存后，页面右侧立刻出现三个滑杆。拖动瞬间重绘，URL 自动同步参数，任何人打开都是 “你的版本”。观众点 “Fork” 即可在副本上继续改，社区链式演进就此发生。
3. 导出 SVG：从浏览器到绘图机
点击 Export SVG，得到纯路径文件：
- 黑白单线，无填充，完美适配笔式绘图机；
- 视图框固定 400×400 逻辑单位，可直接缩放成 A4/A3 纸张。
AxiDraw 推荐参数（实测）：
- 笔速：30 cm/s
- 纸张：160 g 复印黑卡
- 笔：0.3 mm 樱花勾线笔
- 总耗时：约 4 分钟（花瓣 = 7, step=2，全长 1.8 m）。
线下签名、装框、送人，线上代码仍在云端继续分叉。
4. Fork 链案例：站在别人龟壳上再飞
Turtletoy 每条作品都带 “Fork” 按钮。以用户 reinder 的 Cubic cityscape #1 为例：
- 原始：一次螺旋生成 96 个立方体；
- 第一次 Fork：把
scale改成可调节变量，城市密度立刻可玩； - 第二次 Fork：加入
SimplexNoise，让楼高随噪声起伏，生成 “雾城”； - 第三次 Fork：把
right(90)换成right(89.5)，整体出现超现实倾斜； - 最终版本收获 90+ 点赞、30 多次 Fork，一条螺旋演变成千边形未来都市。
这就是 “算法 + 参数 + 社区” 滚雪球的最小闭环：代码即素材，参数即交互，Fork 即传播。
5. 小结与彩蛋
Turtletoy 刻意限制在 “单龟、单色、单画布”，反而让创作者把注意力放回算法本身：极坐标、噪声、L-System、分形、Truchet…… 全都能塞进几十行 JS。下一步？
- 把
noise.js贴进全局，2D 噪声地形立刻出现； - 用
clone()生成多只子龟，做群体行为； - 在
walk里塞if (i % 3 === 0) turtle.circle(5)，瞬间给路径加节点装饰。
写完点 Save，世界就多了一份可执行、可把玩、可绘制的微型艺术。现在轮到你，把下一朵玫瑰、下一片城市、下一阵噪音，压缩进 30 行 JavaScript，让海龟替你爬出无限。
参考资料
[1] Turtletoy 官方 API 文档：https://turtletoy.net/syntax
[2] Turtletoy 社区作品库：https://turtletoy.net/turtle/browse/newest/