技术实现亮点
音频分析核心
使用 Web Audio API 的 AnalyserNode 获取实时频率数据(FFT)
通过 getByteFrequencyData() 提取音频频谱,驱动粒子动画
三维粒子系统
Three.js 实现:
基于 Points + BufferGeometry 创建高效粒子群(10k+粒子)
着色器(Shader)控制粒子大小/颜色随音频变化
动态效果:
低频区粒子膨胀,高频区粒子位移
平滑过渡的粒子轨迹算法(避免视觉跳跃)
交互设计
支持麦克风输入/本地音乐文件
响应式布局适配移动端触摸事件