展开本页目录
开始前准备什么
- 下载本页原创练习素材，或准备自己的有权使用素材。
- 核对本页对应软件或账号实际版本；Remotion 示例需要已有可运行项目。
- 保留原素材、实际参数和独立输出，不覆盖输入。
- 准备有版权的真实音频
- 读取音频并等加载结束
- 计算当前帧频谱
- 按共同尺度绘制柱高
- 静音和声音分别抽帧
- 输出后核对音画同步
下载本教程完整练习素材
包含独立输入、模板、原创图形与 HTML 教材、验收表和离线检查；不包含外部账号或付费模型结果。
下载 tone.wav
本页具体任务输入或操作模板；按步骤替换为自己的实际材料。
下载验收记录 CSV
保留实际结果证据，默认待验证，不用人工预期填充通过。
1. 准备有版权的真实音频
下载 tone.wav，它是本地数学合成的练习音，包含音调与静音段，不是模型配音或真实人声。换实际音轨时保留时长、来源与允许使用范围。
2. 读取音频并等加载结束
在自己的项目使用 useAudioData(staticFile("tone.wav"))，加载前返回空；同时保留实际音频播放组件。读不到文件时先查 public 路径，不用随机数字掩盖错误。
3. 计算当前帧频谱
调用 visualizeAudio，传 fps、frame、audioData 与 numberOfSamples:32。采样数量使用二的幂。返回的是频率区间幅度，不称作逐个原始音频样本。
4. 按共同尺度绘制柱高
每根柱子的高度来自该帧频谱值，颜色与间距可以设计，但别用随机动画或循环高度代替真实数据。保持可见最大高度，异常数值做明确处理。
5. 静音和声音分别抽帧
在真实合成中分别看音调段与静音段，检查声音停止后不会继续显示随机跳动。本站波形教材按 tone.wav 的本地样本绘制，不是 Remotion 频谱实测帧。
6. 输出后核对音画同步
完整播放实际 MP4，若音频被裁切或偏移，同步修改可视化时间源。保留原 WAV 与组件，页面未执行付费音频生成。
7. 下载材料并关联实际结果
先运行素材包内的 node check.mjs 检查输入结构，再完成需要账号或编辑器的步骤。离线通过不表示模型生成、外部软件导出或自然流量已经验证。
怎样确认已经完成
- 柱高确实来自指定音频数据而非随机数。
- 音轨与可视化用同一时间源。
- 静音段和实际导出已试听核对。
常见问题
声波图和频谱图是一回事吗？
不是。音频波形按时间看样本变化，visualizeAudio 返回当前时刻不同频段的幅度；本页分别说明教材波形与项目频谱。
出现漂亮跳动柱就算正确吗？
不算。必须对指定音频、静音段与偏移一起核对，随机柱不能证明音画关联。