createAnalyser() 方法在 BaseAudioContext interface creates an AnalyserNode , which can be used to expose audio time and frequency data and create data visualisations.

注意 : For more on using this node, see the AnalyserNode 页面。

句法

var analyserNode = baseAudioContext.createAnalyser();
					

返回

AnalyserNode .

范例

The following example shows basic usage of an AudioContext to create an Analyser node, then use requestAnimationFrame() to collect time domain data repeatedly and draw an "oscilloscope 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.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();
					

规范

规范 状态 注释
Web 音频 API
The definition of 'createAnalyser()' 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
createAnalyser Chrome 10 Prefixed
10 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Edge ≤18 Firefox 53 注意事项
53 注意事项
Originally implemented on AudioContext in Firefox 25.
IE 不支持 No Opera 22
22
15 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Safari 6 Prefixed
6 Prefixed
Prefixed Implemented with the vendor prefix: webkit
WebView Android Yes Chrome Android 33 Firefox Android 53 注意事项
53 注意事项
Originally implemented on AudioContext in Firefox Android 26.
Opera Android 22
22
14 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Safari iOS 6 Prefixed
6 Prefixed
Prefixed Implemented with the vendor prefix: webkit
Samsung Internet Android 2.0

图例

完整支持

完整支持

不支持

不支持

见实现注意事项。

要求使用供应商前缀或不同名称。

要求使用供应商前缀或不同名称。

另请参阅

元数据

  • 最后修改: