首页 > 解决方案 > 三. 音频过滤器未使用 linearRampToValueAtTime 加速

问题描述

我在使用应用于 WebAudio 的 BiQuadFilter 上的 linearRampToValueAtTime 时遇到了一些麻烦。
音频工作正常,并应用了初始低通滤波器。
问题是,一旦我使用 linearRamp 方法调出频率,它似乎忽略了 endTime 参数(或者更好的是,它的时间不正确)。

一些代码可以更好地解释它。
这是实例:

this.audioLoader.load( 'public/media/soundtrack-es_cobwebs_in_the_sky.mp3', buffer => {
    this.sounds.soundtrack = new THREE.Audio(this.listener);
    const audioContext = this.sounds.soundtrack.context;

    this.biquadFilter = audioContext.createBiquadFilter();
    this.biquadFilter.type = "lowpass"; // Low pass filter
    this.biquadFilter.frequency.setValueAtTime(200, audioContext.currentTime);

    this.sounds.soundtrack.setBuffer(buffer);
    this.sounds.soundtrack.setFilter(this.biquadFilter);
    this.sounds.soundtrack.setVolume(0.5);
    this.sounds.soundtrack.play();
})

直到这里,一切看起来都很好。声音会根据需要低沉播放。
然后,在某个事件之后,有一个镜头过渡,我希望声音逐渐打开。

作为 endTime 参数,我传递了 2 秒 + 内部上下文增量。

this.sounds.soundtrack.filters[0].frequency.linearRampToValueAtTime(2400, 2 + this.sounds.soundtrack.context.currentTime);

期望在两秒钟内听到斜坡,但声音立即打开。我错过了什么?

标签: three.jsweb-audio-api

解决方案


线性斜坡将使用前一个事件作为startTime. 在您的情况下,这将是audioContext.currentTime您创建过滤器的时间点。如果那是很久以前的事,听起来好像斜坡直接跳到了结束值。您可以通过在坡道前插入新事件来解决此问题。

const currentTime = this.sounds.soundtrack.context.currentTime;
const filter = this.sounds.soundtrack.filters[0];

filter.frequency.setValueAtTime(200, currentTime);
filter.frequency.linearRampToValueAtTime(2400, currentTime + 2);

推荐阅读