在此页

• 句法
• 范例
• 规范
• 浏览器兼容性
• 另请参阅
• 相关话题

frequencyBinCount 只读特性在 AnalyserNode interface is an unsigned integer half that of the AnalyserNode.fftSize . This generally equates to the number of data values you will have to play with for the visualization.

句法

var arrayLength = analyserNode.frequencyBinCount;
					

值

An unsigned integer, equal to the number of values that AnalyserNode.getByteFrequencyData() and AnalyserNode.getFloatFrequencyData() copy into the provided TypedArray .

For technical reasons related to how the Fast Fourier transform is defined, it is always half the value of AnalyserNode.fftSize . Therefore, it will be one of 16 , 32 , 64 , 128 , 256 , 512 , 1024 , 2048 , 4096 , 8192 ，和 16384 .

范例

The following example shows basic usage of an AudioContext to create an AnalyserNode ，那么 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 demo (see app.js lines 128–205 for relevant code).

var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var analyser = audioCtx.createAnalyser();
analyser.minDecibels = -90;
analyser.maxDecibels = -10;
  ...
analyser.fftSize = 256;
var bufferLength = analyser.frequencyBinCount;
console.log(bufferLength);
var dataArray = new Uint8Array(bufferLength);
canvasCtx.clearRect(0, 0, WIDTH, HEIGHT);
function draw() {
  drawVisual = requestAnimationFrame(draw);
  analyser.getByteFrequencyData(dataArray);
  canvasCtx.fillStyle = 'rgb(0, 0, 0)';
  canvasCtx.fillRect(0, 0, WIDTH, HEIGHT);
  var barWidth = (WIDTH / bufferLength) * 2.5 - 1;
  var barHeight;
  var x = 0;
  for(var i = 0; i < bufferLength; i++) {
    barHeight = dataArray[i];
    canvasCtx.fillStyle = 'rgb(' + (barHeight+100) + ',50,50)';
    canvasCtx.fillRect(x,HEIGHT-barHeight/2,barWidth,barHeight/2);
    x += barWidth;
  }
};
draw();
					

规范

规范	状态	注释
Web 音频 API The definition of 'frequencyBinCount' in that specification.	工作草案

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
frequencyBinCount	Chrome 14	Edge 12	Firefox 25	IE 不支持 No	Opera 15	Safari 6	WebView Android Yes	Chrome Android 18	Firefox Android 26	Opera Android 14	Safari iOS 6	Samsung Internet Android 1.0

图例

完整支持

完整支持

不支持

不支持

另请参阅

• 使用 Web 音频 API

元数据

• 最后修改： 2019 年 3 月 23 日

相关话题

1. Web 音频 API
2. AnalyserNode
3. 构造函数

   1. AnalyserNode()
4. 特性

   1. fftSize
   2. frequencyBinCount
   3. maxDecibels
   4. minDecibels
   5. smoothingTimeConstant
5. 方法

   1. getByteFrequencyData()
   2. getByteTimeDomainData()
   3. getFloatFrequencyData()
   4. getFloatTimeDomainData()
6. 继承：

   1. AudioNode
   2. EventTarget
7. Related pages for Web Audio API

   1. AudioBuffer
   2. AudioBufferSourceNode
   3. AudioContext
   4. AudioContextOptions
   5. AudioDestinationNode
   6. AudioListener
   7. AudioNode
   8. AudioNodeOptions
   9. AudioParam
   10. AudioProcessingEvent
   11. AudioScheduledSourceNode
   12. AudioWorklet
   13. AudioWorkletGlobalScope
   14. AudioWorkletNode
   15. AudioWorkletProcessor
   16. BaseAudioContext
   17. BiquadFilterNode
   18. ChannelMergerNode
   19. ChannelSplitterNode
   20. ConstantSourceNode
   21. ConvolverNode
   22. DelayNode
   23. DynamicsCompressorNode
   24. GainNode
   25. IIRFilterNode
   26. MediaElementAudioSourceNode
   27. MediaStreamAudioDestinationNode
   28. MediaStreamAudioSourceNode
   29. OfflineAudioCompletionEvent
   30. OfflineAudioContext
   31. OscillatorNode
   32. PannerNode
   33. PeriodicWave
   34. StereoPannerNode
   35. WaveShaperNode