我真的很想创建某种均衡器/可视化器来表示来自<audio>标签的音频。到目前为止，我已经能够找到几个可视化音频的非常奇特的实验。他们中的大多数都基于webgl，并且只在chrome中工作。我想要实现的要简单得多，它只是一个基本的，一种颜色，二维可视化，没什么特别的。
这与我想要实现的非常相似（中间的某种图像和两侧的可视化，非常基本，但我喜欢它;））http://www.youtube.com/watch?v=yLRyAz0WFnw < BR />
我希望它的工作方式是基于音频标签的src渲染/创建可视化，例如
<audio id="test"
src="http://api.soundcloud.com/tracks/78404260/stream?client_id=7a17129ba9cd5fff34f847e3539829b7">
</audio>
<!-- Some example from sound cloud -->
并且页面上会有一个canvas标记，它从带有特定id的音频标记中获取src，在本例中为“test”。我不认为这个简单的东西应该要求使用WebGl，而是想使用普通的画布，所以它适用于大多数支持html5的浏览器。我是一个javascript新手，所以我不知道从哪里开始。我之前提到了几个例子，但看看它们的来源根本没有帮助。我正在寻找优雅的解决方案，没有任何复杂的事情发生。我知道stackoverflow不是要求完整的代码，所以如果你能让我开始，例如解释如何与音频互动，根据正在播放的内容改变那些“均衡棒”的大小......会很棒;））（也欢迎jQuery建议）
答案 0 :(得分：4)
您不应使用音频，而应使用WebAudio Api
Chrome，Safari，Firefox，Edge处理它，但IE没有
（见这里：http://caniuse.com/audio-api）
当心webaudio在Safari（webkit）上有前缀。
如果您想要更全球化的范围，SoundManager2可能会
（一个可能的）回答您的需求，因为它适用于所有浏览器
闪电后退：
http://www.schillmania.com/projects/soundmanager2/
使用WebAudio，本文将介绍如何进行频率分析 在任何轨道上以一种非常简单的方式： http://joshondesign.com/p/books/canvasdeepdive/chapter12.html
答案 1 :(得分：1)
有一个图书馆已经出现了这个名为dancer.js的低杠杆部分（它有一些杀手级演示）。
我的方法不像您要求的那样动画，但我这样做的方式（demo，按“播放所有歌曲”）是在上传歌曲时预先生成波形，并使用CSS（通过设置波形background-image的{{1}}。这种方法效果非常好。
答案 2 :(得分：0)
我创建了一个跨平台音乐均衡器，你可以在均衡开启时播放音频文件：你可以看到教程和演示并从http://www.bestofjqueryplugins.com/plugins.php?name=jquery-music-equalizer下载源代码