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

Web Audio使用一系列“节点”将源文件连接到目标，而分析器是一种可以沿路径存在的节点（here's a great overview）。要在Howler流中获取分析器，您需要将其插入到Howler创建的节点序列中。幸运的是，Howler暴露了其节点序列的核心元素。

最简单的用例是为Howler的所有音频输出创建一个分析器，即“主”。 Howler中的每个Howl，插件和失真节点都流经 masterGain 节点，该节点直接连接到目标节点。这就是我们放置分析仪的地方。

// 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）：似乎目前不需要将分析仪重新连接到原始吼声目的地，实际上会导致严重的音质问题。最后一行应该省略。

现在您的分析仪已连接到咆哮，咆哮播放的任何内容都可通过analyser.getByteTimeDomainData(dataArray)等获得。从这里，您可以运行所需的任何分析器/可视化方法I started with these。

Answer 2

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

//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

开始请求分析结果

将分析仪连接到咆哮声

2 个答案: