The getFloatFrequencyData()
method of the AnalyserNode
Interface copies the current frequency data into a Float32Array
array passed into it.
If the array has fewer elements than the AnalyserNode.frequencyBinCount
, excess elements are dropped. If it has more elements than needed, excess elements are ignored.
Syntax
var audioCtx = new AudioContext();
var analyser = audioCtx.createAnalyser();
var myDataArray = new Float32Array(analyser.frequencyBinCount); // Float32Array should be the same length as the frequencyBinCount
analyser.getFloatFrequencyData(myDataArray); // fill the Float32Array with data returned from getFloatFrequencyData()
Returns
A Float32Array
.
Example
The following example shows basic usage of an AudioContext
to create an AnalyserNode
, then requestAnimationFrame
and <canvas>
to collect frequency data repeatedly and draw a "winamp bargraph style" output of the current audio input. For more complete applied examples/information, check out our Voice-change-O-matic-float-data demo (see the source code too).
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();
...
analyser.fftSize = 256;
var bufferLength = analyser.frequencyBinCount;
console.log(bufferLength);
var dataArray = new Float32Array(bufferLength);
canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
function draw() {
drawVisual = requestAnimationFrame(draw);
analyser.getFloatFrequencyData(dataArray);
canvasCtx.fillStyle = 'rgb(0, 0, 0)';
canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
var barWidth = (WIDTH / bufferLength) * 2.5;
var barHeight;
var x = 0;
for(var i = 0; i < bufferLength; i++) {
barHeight = (dataArray[i] + 140)*2;
canvasCtx.fillStyle = 'rgb(' + Math.floor(barHeight+100) + ',50,50)';
canvasCtx.fillRect(x,HEIGHT-barHeight/2,barWidth,barHeight/2);
x += barWidth + 1;
}
};
draw();
Parameters
- array
- The
Float32Array
that the frequency domain data will be copied to.
Specifications
Specification | Status | Comment |
---|---|---|
Web Audio API The definition of 'getFloatFrequencyData()' in that specification. |
Working Draft |