将分析仪连接到啸叫声

Question

我尝试了一段时间将分析仪连接到啸叫声，但没有成功。

我这样创建我的吼叫声：

var sound = new Howl({
    urls: [
        '/media/sounds/genesis.mp3',
    ]
});

然后我使用 Howler 全局上下文创建我的分析器，如下所示：

var ctx = Howler.ctx;
var analyser = ctx.createAnalyser();
var dataArray = new Uint8Array(analyser.frequencyBinCount);
analyser.getByteTimeDomainData(dataArray);

我对网络音频很陌生API。我想我在某处缺少连接，但我不知道我必须在 Howler 中连接什么。

Answer 1

您需要将输出要分析的音频的节点连接到分析器节点，然后将分析器节点连接到上下文目标（或另一个节点）。所以像这样：

//this is a bufferSource with a decoded buffer that we want to analyse
source.connect(analyser);
analyser.connect(context.destination);

完成后，您应该可以开始根据 https://developer.mozilla.org/en-US/docs/Web/API/AnalyserNode

请求分析结果

Answer 2

Web Audio 使用 "nodes" 序列将源文件连接到目的地，分析器是一种可以存在于路径上的节点类型 (here's a great overview)。要在 Howler 流程中获取分析器，您需要将其插入到 Howler 创建的节点序列中。幸运的是，Howler 暴露了其节点序列的核心元素。

最简单的用例是为 Howler 的所有音频输出创建一个分析器，也就是 "master"。 Howler 中的每个 Howl、插件和失真节点都流经 masterGain 节点，该节点直接连接到 destination 节点。那就是我们放置分析器的地方。

// Create an analyser node in the Howler WebAudio context
var analyser = Howler.ctx.createAnalyser();

// Connect the masterGain -> analyser (disconnecting masterGain -> destination)
Howler.masterGain.connect(analyser);

// Connect the analyser -> destination
analyser.connect(Howler.ctx.destination);

*编辑（2018-04-25）：似乎目前没有必要将分析仪重新连接到原始的啸叫目的地，实际上会导致严重的音质问题。应省略最后一行。

现在您的分析仪已连接到 Howler，并且可以通过 analyser.getByteTimeDomainData(dataArray) 等方式访问 Howler 播放的任何内容。从这里你可以运行任何你想要的 analyser/visualization 方法，I started with these.

将分析仪连接到啸叫声

Connect analyzer to Howler sound

audio

howler.js

web-audio-api