ハウラー+ ctxアナライザーの問題

Question

ハウラーセットアップにオーディオアナライザーノードを接続しようとしています。

問題は、サウンドが再生されていないことを意味する "128"で配列が取得されることです。ここで

は私のコードです：ここでは

var Sound = new Howl({ 
       src: 'https://ia802508.us.archive.org/5/items/testmp3testfile/mpthreetest.mp3', 
       html5: true, 
       format: ['mp3'] 
      }); 

    Sound.play(); 

    // Create analyzer 
    var analyser = Howler.ctx.createAnalyser(); 

    // Connect master gain to analyzer 
    Howler.masterGain.connect(analyser); 

    // Connect analyzer to destination 
    analyser.connect(Howler.ctx.destination); 

    // Creating output array (according to documentation https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API) 
    analyser.fftSize = 2048; 
    var bufferLength = analyser.frequencyBinCount; 
    var dataArray = new Uint8Array(bufferLength); 

    // Get the Data array 
    analyser.getByteTimeDomainData(dataArray); 

    // Display array on time each 3 sec (just to debug) 
    setInterval(function(){ 
    analyser.getByteTimeDomainData(dataArray); 
    console.dir(dataArray); 
    }, 3000); 

は最小限に減らす私のプロジェクトのplunkerです：

Plunker

私の実装は、これらのソースに基づいています。上の

avanwink answerこの投稿

The documentation of sound visualization

Answer 1

固定！

以前はラジオストリームを使用してプレイヤーをテストしていたため、Howlオブジェクトでhtml5オプションをtrueに設定しました。このオプションを削除

、ホエザルはウェブオーディオAPIを使用することができますので、私の問題は、固定：

作業バージョン：

var Sound = new Howl({ 
       src: 'https://ia802508.us.archive.org/5/items/testmp3testfile/mpthreetest.mp3', 
       format: ['mp3'] 
      }); 

    Sound.play(); 

    // Create analyzer 
    var analyser = Howler.ctx.createAnalyser(); 

    // Connect master gain to analyzer 
    Howler.masterGain.connect(analyser); 

    // Connect analyzer to destination 
    analyser.connect(Howler.ctx.destination); 

    // Creating output array (according to documentation https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API) 
    analyser.fftSize = 2048; 
    var bufferLength = analyser.frequencyBinCount; 
    var dataArray = new Uint8Array(bufferLength); 

    // Get the Data array 
    analyser.getByteTimeDomainData(dataArray); 

    // Display array on time each 3 sec (just to debug) 
    setInterval(function(){ 
    analyser.getByteTimeDomainData(dataArray); 
    console.dir(dataArray); 
    }, 3000);