首页 > 解决方案 > WEB AUDIO API 产生雨噼啪声

问题描述

我正在尝试在 javascript Web Audio API 中创建雨。到目前为止,我已经为背景创建了一个低频隆隆声,我正在研究一个高频噪声,它将模仿雨滴的声音。然而,现在的高频噪声很像白噪声,太强而不能成为单个液滴。有谁知道如何将声音“分离”一点,使它听起来几乎像噼啪声。是一个链接,如果你增加最后一个滑块(紫色),我希望高频噪音听起来像你能听到它。

到目前为止,这是我的 HTML 代码

<script>
let context= new AudioContext();
let context2= new AudioContext();

let lowpass = context.createBiquadFilter();
  lowpass.type = 'lowpass';
  //lowpass.Q.value = -7.01;
  lowpass.frequency.setValueAtTime(80, context2.currentTime);

let gain = new GainNode(context);
  gain.gain.value= 0.4;

let gain2 = new GainNode(context2);
  gain2.gain.value= 0.02;

let highpass=context2.createBiquadFilter();
  highpass.type = 'highpass';
  highpass.Q.value = 2;
  //highpass.frequency.setValueAtTime(6000, context2.currentTime);

let distortion = context2.createWaveShaper();

let delay = context2.createDelay(90.0);




function StartAudio() {context.resume()};
context.audioWorklet.addModule('basicnoise.js').then(() => {
  let myNoise = new AudioWorkletNode(context,'noise-generator');

  myNoise.connect(lowpass);
  lowpass.connect(gain);
  gain.connect(context.destination);
});

function StartAudio2() {context2.resume()};
context2.audioWorklet.addModule('basicnoise.js').then(() => {
  let myNoise2 = new AudioWorkletNode(context2,'noise-generator');

  myNoise2.connect(highpass);
  highpass.connect(gain2);
  gain2.connect(delay);
  delay.connect(context2.destination);
});

我一直在玩不同的功能,其中一些没有做太多,或者我只是没有正确使用它们,因为我对音频 API 场景非常陌生。感谢任何帮助,因为这是一个学校项目,我知道其他一些学生想要发出火声,也可以从噼啪声中受益!谢谢 !!

标签: javascriptapiwebaudio

解决方案


如果您将下雨视为一个物理过程,那么它基本上是大量的表面撞击声音(可能还有一些由气流产生的额外氛围)。当足够多的雨滴以足够快的速度撞击表面时,最终的结果就是噪音。

我认为一个逼真的雨水发生器会模拟许多单个水滴在距听者不同距离处撞击表面(这会导致衰减和过滤)。

也就是说,如果您想尝试“破解”您现在正在进行的噪声发生器,请尝试随机调制增益节点的增益值;在这里,发生器有 25% 的机会每 20 毫秒有效地静音(或者,考虑到计时器并不精确)。

setInterval(() => {
  gain.gain.value=(Math.random() < 0.75 ? 0.4 : 0);
}, 20)

推荐阅读