javascript - Web音频增益节点未完全静音

标签 javascript audio web-audio-api

我一直在尝试完全过滤,衰减或静音应用程序中的音频。通过此代码,我可以使用找到的解决方案使音频稍微安静一些,但是将gainNode.gain.value设置为0实际上并不会将其设置为0,而负整数会使它变大。我以为可能有2条途径让声音播放,而增益节点只是其中之一,但我看不出如何隔离它。到目前为止,我添加的过滤器也没有任何作用,但我只是希望能够消除声音。

window.onload = function () {
var volumeBars = {
    mono: document.getElementById("monoFill")
};

document.getElementById("open-file").onchange = function (evt) {
    var file = evt.target.files[0];
    var reader = new FileReader();
    reader.onload = function (e) {
        playSound(e.target.result);
    }
    reader.readAsArrayBuffer(file);
}
document.getElementById("open-file1").onchange = function (evt) {
    var file = evt.target.files[0];
    var reader = new FileReader();
    reader.onload = function (e) {
        playSound1(e.target.result);
    }
    reader.readAsArrayBuffer(file);
}

var context = new AudioContext();
var context1 = new AudioContext();

var playbackControl = document.querySelector('.playback-rate-control');
    var playbackValue = document.querySelector('.playback-rate-value');
    var panControl = document.querySelector('.panning-control')
    var panValue = document.querySelector('.panning-value');
    var mute = document.querySelector('.mute');
    var gainSlider = document.getElementById("gainSlider");
    var filtControl = document.querySelector(".filter-control")
    var filtValue = document.querySelector(".filter-value");

    function playSound(arraybuffer) {
        context.close();
        context = new AudioContext();

        var source = context.createBufferSource();
        var gainNode = context.createGain();
        var panNode = context.createStereoPanner();
        var filter = context.createBiquadFilter();
        filter.type = 'lowpass';



        source.connect(panNode);
        panNode.connect(context.destination);
        context.decodeAudioData(arraybuffer, function (buffer) {
            source.buffer = buffer;
            source.loop = true;
            source.playbackRate.value = playbackControl.value;


            source.connect(gainNode);

            gainNode.connect(context.destination);
            source.connect(filter);
            filter.connect(gainNode);

            //speed slider
            playbackControl.oninput = function () {
                source.playbackRate.value = playbackControl.value;
                playbackValue.innerHTML = playbackControl.value;
            }
            //pan slider
            panControl.oninput = function () {
                panNode.pan.value = panControl.value;
                //   panValue.innerHTML = panControl.value;
            }
            //filter slider
            filtControl.oninput = function () {
                filter.frequency.value = filtControl.value;
                filtValue.innerHTML = filtControl.value;
            }

            gainSlider.addEventListener('change', function () {
                gainNode.gain = this.value;
            });

            mute.onclick = voiceMute;

            function voiceMute() {
                if (mute.id == "") {
                    gainNode.gain.value = 0;
                    mute.id = "activated";
                    mute.innerHTML = "Unmute";
                } else {
                    gainNode.gain.value = 1;
                    mute.id = "";
                    mute.innerHTML = "Mute";
                }
            }
        });
<div>
  <button class="mute">Mute button</button>
</div>
<p><input class="filter-control" type="range" min="0" max="400" step="1" value="400">
<span class="filter-value">1.0</span></p>
<p><input id="gainSlider" type="range" min="0" max="1" step=".05" value="1">Volume</p>
<p><input class="playback-rate-control" type="range" min="0.25" max="3" step="0.01" value="1">
<span class="playback-rate-value">1.0</span></p>
<p><input class="panning-control" type="range" min="-1" max="1" step=".05" value="0">Pan</p>

最佳答案

添加功能以断开节点连接以防止音频到达目的地

pause=function(){
filter.disconnect();
};
// and to play
var play=function(){
filter.connect(gainNode);
};

关于javascript - Web音频增益节点未完全静音,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44883004/

相关文章:

javascript - 播放网络音频时 Chrome Css 动画中断

audio - Web Audio API 注意事项

javascript - 将 jQuery 操作应用于特定控件

javascript - Vue 3 类与变量的绑定(bind)是否需要内联?

iphone - 滚动到下一页时如何自动播放声音?

c# - 统一获取基本音频频谱数据

javascript - 没有 getUserMedia 的声音分析

javascript - 让 Chartjs 显示数据标签的键而不是值

javascript - angularjs 如何使用 ng-repeat 创建 div 堆栈

c# - 使用 SoundPlayer 播放声音