は、ライブ入力でgetFloatFrequencyDataを使用してWebオーディオに

Question

の作業例を周波数データを得ていません。私はデータを取得していることを確認しました。

私は周波数データを取得しようとしていますが、-Infinity（またはFirefoxでは-100）の配列として返します。

私はこれについてMDNドキュメントを使いましたが、すべてのものが整っているように見えますが、頻度データは取得できません。私は別のことをする必要がある任意のアイデア？

HTML

Audio Data: 
<div id="audio-data"></div> 

Frequency Data: 
<div id="frequency-data"></div> 

JS

window.addEventListener('load',() => { 
    navigator.mediaDevices.getUserMedia({audio: true}) 
    .then((stream) => { 
     const audioDataDisplay = document.querySelector('#audio-data'); 
     const frequencyDataDisplay = document.querySelector('#frequency-data'); 
     const context = new AudioContext(); 
     const source = context.createMediaStreamSource(stream); 
     const processor = context.createScriptProcessor(256, 1, 1); 

     source.connect(processor); 
     processor.connect(context.destination); 

     // route default microphone audio to default speaker output for system 
     // display live audio buffer data 
     processor.onaudioprocess = (data) => { 
     const channelCount = data.outputBuffer.numberOfChannels; 

     for (let i = 0; i < channelCount; i++) { 
      const inputChannelData = data.inputBuffer.getChannelData(i); 
      const outputChannelData = data.outputBuffer.getChannelData(i); 

      for (let j = 0; j < inputChannelData.length; j++) { 
      outputChannelData[j] = inputChannelData[j]; 
      } 

      audioDataDisplay.innerHTML = outputChannelData; 
     } 
     } 

     // analyze the frequency data and display data 
     // only shows as an array of -Infinity in Chrome, -100 in Firefox. 
     const analyser = context.createAnalyser(); 
     const dataArray = new Float32Array(analyser.frequencyBinCount); 

     setInterval(() => { 
     analyser.getFloatFrequencyData(dataArray); 
     frequencyDataDisplay.innerHTML = dataArray; 
     }, 1000); 
    }); 
}); 

Answer 1

あなたのアナライザのノードには何も接続することはありませんしています。アナライザー作成後、

source.connect(analyser); 

のようなものを追加します。