AnalyserNode

AnalyserNode インタフェースはリアルタイム時間領域/周波数領域分析情報を表現します。AudioNodeは、入力から出力の流れにおいて audio stream そのものは変えず、データ加工や音声の可視化をすることができます。

１つのAnalyzerNodeは必ず１つの入力と出力を持ちます。出力先がなくても AnalyzerNode は問題ありません。

Without modifying the audio stream, the node allows to get the frequency and time-domain data associated to it, using a FFT.

Number of inputs 1
Number of outputs 1 (but may be left unconnected)
Channel count mode "explicit"
Channel count 1
Channel interpretation "speakers"

Inheritance

このインタフェースは以下のインタフェースと継承関係にあります。:

EventTarget AudioNode AnalyserNode

Properties

以下は、AudioNodeからプロパティを継承する.

AnalyserNode.fftSize (en-US)

符号なしの long 型の値で FFT（高速フーリエ変換）において周波数領域を決定するために使われているサイズを表している。

AnalyserNode.frequencyBinCount (en-US) 読取専用

符号なしの long 型で FFT（高速フーリエ変換）のサイズの半分の値。一般的に音声再生時の可視化に用いられる。

AnalyserNode.minDecibels (en-US)

unsigned byte 型値へ変換する FFT 分析データのスケーリング時の最小のパワー値を表す double 型の値である。一般的に、この値は、getByteFrequencyData()の使用時の結果の範囲の最小値として明記される。

AnalyserNode.maxDecibels (en-US)

unsigned byte 型値へ変換する FFT 分析データのスケーリング時の最大のパワー値を表す double 型の値である。一般的に、この値は、getByteFrequencyData()の使用時の結果の範囲の最大値として明記される。

AnalyserNode.smoothingTimeConstant (en-US)

分析フレームの平均間隔を表す double 型の値で、使用例として時間的にスペクトルを平滑化させるのに用いられる。

Methods

AudioNodeからメソッドを継承する.

AnalyserNode.getFloatFrequencyData() (en-US)

周波数データを引数として渡された Float32Array 配列へコピーする。

AnalyserNode.getByteFrequencyData() (en-US)

周波数データを引数として渡された Uint8Array 配列(unsigned byte 配列)へコピーする。

AnalyserNode.getFloatTimeDomainData() (en-US)

音声波形データを引数として渡された Float32Array 配列へコピーする。

AnalyserNode.getByteTimeDomainData() (en-US)

音声波形データを引数として渡された Uint8Array 配列(unsigned byte 配列)へコピーする。

Examples

メモ: オーディオヴィジュアライゼーションのための Web Audio API を使ったヴィジュアライゼーションガイドを御覧ください。

Basic usage

以下の例では、AudioContext から１つの AnalyserNode を作成しており、requestAnimationFrame と<canvas>へ繰り返し時間波形データを繰り返し集め現入力を“オシロスコープスタイル”で出力し描画している。

より多くのサンプルは 我々の Voice-change-O-matic デモにご覧頂けます。 (see app.js lines 128–205 for relevant code).

var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();

  ...

analyser.fftSize = 2048;
var bufferLength = analyser.frequencyBinCount;
var dataArray = new Uint8Array(bufferLength);
analyser.getByteTimeDomainData(dataArray);

// draw an oscilloscope of the current audio source

function draw() {

      drawVisual = requestAnimationFrame(draw);

      analyser.getByteTimeDomainData(dataArray);

      canvasCtx.fillStyle = 'rgb(200, 200, 200)';
      canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);

      canvasCtx.lineWidth = 2;
      canvasCtx.strokeStyle = 'rgb(0, 0, 0)';

      canvasCtx.beginPath();

      var sliceWidth = WIDTH * 1.0 / bufferLength;
      var x = 0;

      for(var i = 0; i < bufferLength; i++) {

        var v = dataArray[i] / 128.0;
        var y = v * HEIGHT/2;

        if(i === 0) {
          canvasCtx.moveTo(x, y);
        } else {
          canvasCtx.lineTo(x, y);
        }

        x += sliceWidth;
      }

      canvasCtx.lineTo(canvas.width, canvas.height/2);
      canvasCtx.stroke();
    };

    draw();

Specifications

Specification
Web Audio API
# AnalyserNode

Browser compatibility

BCD tables only load in the browser

See also