daily-work-20261028:基于原生 JavaScript 与 Canvas 2D 的傅里叶周转圆可视化项目

可用于交互式观察傅里叶周转圆重建曲线的过程,通过调节谐波数量查看不同阶次的逼近效果。支持自由手绘与心形预设,基于离散傅里叶变换计算复数系数,零依赖单文件运行,每日种子自动换装配色与布局。【此简介由AI生成】

Branch1Tags0

傅里叶周转圆绘图 · 1028期

手绘曲线,观察周转圆重建轨迹

使用离散傅里叶变换把手绘采样转换为周转圆,调节谐波数量观察曲线重建,也可载入心形预设。

架构图

实际运行截图


功能特性

特性 说明
离散变换 对最多256个采样点计算复数离散傅里叶系数
谐波调节 滑块控制参与绘图的周转圆数量
自由手绘 拖动画布输入曲线,松开后开始重建
预设曲线 一键载入心形采样

系统架构

整体分为四层:

  1. 输入层 — 接收滑块、按钮或画布指针操作
  2. 状态层 — 保存模式参数及粒子、系数或节点状态
  3. 更新层 — 执行对应演示的数值更新
  4. 绘制层 — Canvas 2D 绘制图形与视觉反馈

技术栈

  • Canvas 2D — 全部视觉效果的原生绘制,无任何图形库
  • requestAnimationFrame / 定时器 — 逐帧渲染与世代节拍
  • 种子化伪随机(mulberry32) — 当日种子决定布局与配色,每天面貌一新
  • 原生 JavaScript (ES2020+) — 零依赖、零构建,单个 index.html 即可运行

快速开始

# 直接双击 index.html 用浏览器打开即可,离线可用

期号

1028 期 · 由每日锻造流水线自动生成,同主题次日会换上全新配色与参数。

许可证

MIT

Introduction

可用于交互式观察傅里叶周转圆重建曲线的过程,通过调节谐波数量查看不同阶次的逼近效果。支持自由手绘与心形预设,基于离散傅里叶变换计算复数系数,零依赖单文件运行,每日种子自动换装配色与布局。【此简介由AI生成】

Customize your domain