AudioContext.createAnalyser自动获取?

时间:2014-12-15 01:35:01

标签: javascript web-audio

fft analyser have some sort of auto adjusting gain?你可以在这个演示中看到(使用Chrome或Firefox)光谱似乎可以调整并平整到零,而不是保持恒定的高度。

我认为调整增益可以使音频可视化器看起来更好,但是当你需要真正的增益值时,它肯定不适合DSP。

在本演示中,我使用麦克风音频输入并显示频谱。如果您更改了通过扬声器播放的音量,您将看到频谱变化,但随后会慢慢调整到新的响度。

关键是,在初始瞬态之后,播放粉红噪声(或白噪声)更大或更柔和会产生相同的精确频谱。我希望播放的音乐可以在频谱中反映出来。

任何想法如何解决这个问题我可以绘制真实的光谱?

<html>
<head>
  <title>Pink Noise</title>
</head>
<body>

<canvas id="spectrum"></canvas>

<script type="text/javascript">

var initAudio, microphoneError, microphoneSuccess, pinkNoise;

navigator.getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);

window.requestAnimationFrame = (window.requestAnimationFrame || window.webkitRequestAnimationFrame || window.mozRequestAnimationFrame || window.msRequestAnimationFrame);

microphoneError = function(event) {
  console.log("error")
  if (event.name === "PermissionDeniedError") {
    alert("This app requires a microphone as input. Please adjust your privacy settings.");
  }
};

microphoneSuccess = function(stream) {
  console.log("success")
  initAudio(stream);
};

pinkNoise = function(context) {
  console.log("starting pink noise")
  var b0, b1, b2, b3, b4, b5, b6, bufferSize, pinkNode;
  bufferSize = 4096;
  b0 = b1 = b2 = b3 = b4 = b5 = b6 = 0.0;
  pinkNode = context.createScriptProcessor(bufferSize, 1, 1);
  pinkNode.onaudioprocess = function(e) {
    var i, output, white, _i, _results;
    output = e.outputBuffer.getChannelData(0);
    _results = [];
    for (i = _i = 0; 0 <= bufferSize ? _i < bufferSize : _i > bufferSize; i = 0 <= bufferSize ? ++_i : --_i) {
      white = Math.random() * 2 - 1;
      b0 = 0.99886 * b0 + white * 0.0555179;
      b1 = 0.99332 * b1 + white * 0.0750759;
      b2 = 0.96900 * b2 + white * 0.1538520;
      b3 = 0.86650 * b3 + white * 0.3104856;
      b4 = 0.55000 * b4 + white * 0.5329522;
      b5 = -0.7616 * b5 - white * 0.0168980;
      output[i] = b0 + b1 + b2 + b3 + b4 + b5 + b6 + white * 0.5362;
      output[i] *= 0.11;
      _results.push(b6 = white * 0.115926);
    }
  };
  pinkNode.connect(context.destination);
};


initAudio = function(stream) {
  console.log("init audio")
  var analyser, bufferLength, canvas, canvasElement, context, dataArray, draw, filterNode, height, sourceNode, width;

  canvasElement = document.getElementById("spectrum");
  width = 1000;
  height = 400;

  canvasElement.width = width;
  canvasElement.height = height;
  canvas = canvasElement.getContext("2d");
  context = new AudioContext();

  sourceNode = context.createMediaStreamSource(stream);

  filterNode = context.createBiquadFilter();
  filterNode.type = filterNode.LOWPASS;
  filterNode.frequency.value = 4410;
  filterNode.Q.value = 1.5;
  filterNode.gain.value = 0;

  sourceNode.connect(filterNode);

  analyser = context.createAnalyser();
  analyser.fftSize = 2048;

  filterNode.connect(analyser);

  bufferLength = analyser.frequencyBinCount;
  dataArray = new Uint8Array(bufferLength);
  canvas.clearRect(0, 0, width, height);

  pinkNoise(context);

  draw = function() {
    var barHeight, barWidth, drawVisual, i, x, _i, _results;
    drawVisual = requestAnimationFrame(draw);
    analyser.getByteFrequencyData(dataArray);
    canvas.fillStyle = 'rgb(0, 0, 0)';
    canvas.fillRect(0, 0, width, height);
    barWidth = (width / bufferLength) * 2.5;
    x = 0;
    _results = [];
    for (i = _i = 0; 0 <= bufferLength ? _i < bufferLength : _i > bufferLength; i = 0 <= bufferLength ? ++_i : --_i) {
      barHeight = dataArray[i] / 255 * height;
      canvas.fillStyle = 'rgb(255,50,50)';
      canvas.fillRect(x, height - barHeight, barWidth, barHeight);
      _results.push(x += barWidth + 1);
    }
    _results;
  };
  draw();
};

window.onload = function() {
  console.log("here")
  if (navigator.getUserMedia) {
    console.log("get microphone");
    navigator.getUserMedia({
      audio: true
    }, microphoneSuccess, microphoneError);
  } else {
    alert("This app requires a microphone as input. Please try using Chrome or Firefox.");
  }
};

</script>
</body>
</html>

1 个答案:

答案 0 :(得分:3)

这很可能是由于操作系统声音设置中的自动增益控制设置造成的。

在OSX上,声音首选项在“输入”选项卡中设置了“使用环境降噪”设置。关闭它解决了我的问题。

osx sound preferences