可用于创建沉浸式光效交互体验或作为创意编程练习参考。项目以 Canvas 2D 绘制数十条正弦丝线交织成流动绸缎,支持鼠标控制振幅与流速,每日种子自动生成全新配色,零依赖单文件离线运行。【此简介由AI生成】
Access rate limit exceeded. Please log in to continue.
流光织机 · 1102期-second
移动鼠标,拨动光的经纬
数十条丝线随正弦波流动交织,鼠标纵移拨动振幅、横移改变流速,光在经纬之间织出流动的绸缎。


功能特性
| 特性 | 说明 |
|---|---|
| 经纬织造 | 数十条正弦丝线以不同相位与速度流动,交叠成绸 |
| 鼠标拨弦 | 纵向移动改变振幅,横向移动调节流速,实时跟手 |
| 循环上色 | 各条丝线依次使用调色板中的颜色 |
| 每日配色 | 当日种子决定整体色系与波动气质,每天一匹新布 |
系统架构
整体分为四层:
- 输入层 — mousemove → 振幅 / 流速参数
- 状态层 — 相位累加器与曲线参数表
- 渲染层 — Canvas 2D 逐帧绘制正弦曲线采样折线
- 配色层 — 按丝线序号循环选取调色板颜色
技术栈
- Canvas 2D — 全部视觉效果的原生绘制,无任何图形库
- requestAnimationFrame / 定时器 — 逐帧渲染与世代节拍
- 种子化伪随机(mulberry32) — 当日种子决定布局与配色,每天面貌一新
- 原生 JavaScript (ES2020+) — 零依赖、零构建,单个
index.html即可运行
快速开始
# 直接双击 index.html 用浏览器打开即可,离线可用
期号
1102 期 · 由每日锻造流水线自动生成,同主题次日会换上全新配色与参数。
许可证
MIT