在p5.js中将歌曲音量设置为0时，使用fft分析songfile

Question

在p5.js中，我使用"new p5.FFT(x，y)“来分析放大器mp3文件。

但这有一个小问题，如果您将MP3的音量设置为0(通过使用.setVolume(x))，歌曲文件可能无法分析，因为您将音量设置为0，因此没有输入。

所以我想知道如何分析songfile，即使我将音量设置为0。

Answer 1

诀窍是，您需要在音量仍为非零的点连接FFT，然后在下游有一个节点来控制音量。这里有一个例子，我使用p5.EQ效果来控制音频图的一部分的音量。"Tada“声音连接到快速傅立叶变换和”静音“p5.EQ效果。这使得FFT以最大音量显示声音，但滑块控制声音的实际音量有多大。“丁丁”的声音是直接连接到输出，没有快速傅立叶变换，没有音量控制。

​

let tada, ding;

let tadaBtn, dingBtn;
let volSlider;

let fft;
let mute;

function preload() {
  tada = loadSound('https://www.paulwheeler.us/files/TADA.WAV');
  ding = loadSound('https://www.paulwheeler.us/files/DING.WAV');
}

function setup() {
  createCanvas(windowWidth, windowHeight);

  let controls = createElement('div');
  controls.style('display', 'flex');
  controls.position(10, 10);

  tadaBtn = createButton('Tada');
  tadaBtn.mouseClicked(() => {
    if (!tada.isPlaying()) {
      tada.play();
      tadaBtn.html('Stop');
    } else {
      tada.stop();
    }
  });
  tadaBtn.parent(controls);

  tada.onended(() => {
    tadaBtn.html('Tada');
  });

  dingBtn = createButton('Ding');
  dingBtn.mouseClicked(() => {
    if (!ding.isPlaying()) {
      ding.play();
      dingBtn.html('Stop');
    } else {
      ding.stop();
    }
  });
  dingBtn.parent(controls);

  ding.onended(() => {
    dingBtn.html('Ding');
  });

  volSlider = createSlider(0, 1, 0, 0);
  volSlider.input(() => {
    mute.amp(volSlider.value());
  });
  volSlider.parent(controls);

  tada.disconnect();
  fft = new p5.FFT();
  fft.setInput(tada);

  mute = new p5.EQ();
  mute.amp(volSlider.value());
  tada.connect(mute);
  mute.connect();
}

function draw() {
  background(0);
  drawSpectrumGraph(0, 0, width, height);
}

// Graphing code adapted from https://jankozeluh.g6.cz/index.html by Jan Koželuh
function drawSpectrumGraph(left, top, w, h) {
  let spectrum = fft.analyze();

  stroke('limegreen');
  fill('darkgreen');
  strokeWeight(1);

  beginShape();
  vertex(left, top + h);

  for (let i = 0; i < spectrum.length; i++) {
    vertex(
      left + map(log(i), 0, log(spectrum.length), 0, w),
      top + map(spectrum[i], 0, 255, h, 0)
    );
  }

  vertex(left + w, top + h);
  endShape(CLOSE);
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/p5.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.4.0/addons/p5.sound.min.js"></script>

​