加载应用…
云澜 Clyune 云澜组件库 Clyune Component Gallery · English

Canvas 2D 绘图

HTML5 Canvas 2D 即时绘制:粒子系统、字符雨、烟花物理与手绘画板。

技术栈: CanvasRenderingContext2D, requestAnimationFrame, Pointer Events

  • 粒子网络 — 粒子间距离连线的经典网络背景。
  • 代码雨 — 黑客帝国风格的字符雨。
  • 烟花 — 带重力与拖尾的粒子烟花。
  • 画板 — 指数平滑笔刷与速度感应线宽。
  • 轨道粒子 — 按开普勒第三定律运行的多轨粒子。
  • 指针拖尾 — 链式插值的指针拖尾丝带。
  • 软体团块 — 弹簧顶点构成的软体 Blob。
  • 粒子雨 — 空气阻力下达到终端速度的粒子雨。
  • 波浪 — 多个正弦波叠加的水面。
  • 噪声场 — 分形布朗运动(FBM)噪声场。
  • 群体 — Boids:分离、对齐、聚合三条规则。
  • 爆发 — 速度场决定形状的粒子爆发。
  • 流场 — 噪声角度场驱动的向量场流线。
  • 网格起伏 — 衰减圆形波驱动的网格起伏。
  • 墨水扩散 — 高斯扩散方程的墨水扩散。
  • 极光 — 噪声帘幕构成的极光色带。
  • 星座连线 — k 近邻图构成的星座连线。
  • 沙粒 — 元胞自动机落沙与安息角。
  • 万花筒 — 旋转与镜像对称的万花筒。
  • 闪电折线 — 中点位移分形生成的闪电。
  • 布料感 — Verlet 积分 + 距离约束的布料。
  • 螺旋采样 — 阿基米德 / 对数 / 费马螺线。
  • 隧道穿梭 — 透视投影 r = f·R/z 的伪 3D 隧道。
  • 火焰 — 热量元胞自动机的火焰。
  • 烟雾 — 浮力 + 湍流 + 扩散的烟雾。
  • 反应扩散 — Gray-Scott 反应扩散模型。
  • 等距方块 — 等距投影的 2.5D 柱阵。
  • 2D 融球 — 隐式等值面构成的 2D 融球。
  • 像素化游标 — 降采样与色阶量化的像素化。
  • ASCII 字符画 — 亮度映射字符的 ASCII 字符画。
  • 水波纹点击 — 离散波动方程的水波纹。