createPanner с GainNode в сафари

Я хочу панорамировать влево или вправо за раз, а также установить для него громкость, я сделал это с другими браузерами, но в сафари createStereoPanner не является функцией, поэтому я использовал createPanner для сафари. Теперь проблема в том, что я хочу использовать усиление с panner, чтобы установить громкость, в настоящее время он играет как усиление, так и панорамирование отдельно, он должен установить усиление для панорамирования

вот мой код

            audioElement.setAttribute('src', '/Asset/sounds/calibrate.mp3');
    audioElement.volume = 0.5;
    audioElement.play().then(function (d) {
        audioCtx = new (window.AudioContext || window.webkitAudioContext)();
        source = audioCtx.createMediaElementSource(audioElement);
        if (isSafari) {
            gainNode = audioCtx.createGain();
            gainNode.gain.setValueAtTime(audioElement.volume, audioCtx.currentTime);
            source.connect(gainNode);
            gainNode.connect(audioCtx.destination);

            panNode = audioCtx.createPanner();
            panNode.panningModel = 'HRTF';
            source.connect(panNode);
            panNode.connect(audioCtx.destination);
            //panNode.setPosition(10, 0, 0);

        }
        else {
            panNode = audioCtx.createStereoPanner();
            panNode.pan.value = 0;
            source.connect(panNode);
            panNode.connect(audioCtx.destination);
        }
    });

я проигрываю аудио как с этим справиться


javascript html audio web-audio-api audiocontext
person Mike    schedule 31.12.2019    source источник
comment
Привет, Майк, если вы не хотите поддерживать резервный вариант самостоятельно, вы также можете использовать standardized-audio- контекст. Существует также отдельный полифилл (stereo-panner-node), но, к сожалению, он не поддерживается. к настоящему времени.   -  person chrisguttandin    schedule 02.01.2020

Ответы (1)


arrow_upward
2
arrow_downward

Реализация PannerNode в webKit еще не завершена. На этот вопрос уже был дан ответ в предыдущем сообщении SO , хотя и без полного рабочего примера и дополнительной сложности узла усиления.

Выход panner всегда стерео, поэтому он должен быть последним в цепочке. Соединения должны идти

Source Sound -> GainNode -> PannerNode -> AudioContext.destination

Пример кода приведен ниже, и JSFiddle можно найти здесь. Этот пример жестко перемещается на правый канал.

<!DOCTYPE html>
<html>

  <head>
    <script>
var audioCtx = new(window.AudioContext || window.webkitAudioContext)();
var gainNode = audioCtx.createGain();
var gain = 0.01;
gainNode.gain.setValueAtTime(gain, audioCtx.currentTime);
//---------------------------------------------------------------------
var pan = 1; // This should be in range [-1, 1]

if (audioCtx.createStereoPanner)
{
  var panner = audioCtx.createPanner();
  panner.pan.value = pan;
}
else
{
  var panner = audioCtx.createPanner();
  panner.panningModel = 'equalpower';
  panner.setPosition(pan, 0, 1 - Math.abs(pan));
}

gainNode.connect(panner);
panner.connect(audioCtx.destination);
    </script>
  </head>
  <!-- ===================================================================== -->

  <body>

    <div>
      <button onclick="myFunction()">
        Click me
      </button>
    </div>
    <script>
function myFunction()
{
  //---------------------------------------------------------------------
  var duration = 0.5; // in seconds
  //---------------------------------------------------------------------
  var oscillator = audioCtx.createOscillator();
  oscillator.type = 'square';
  oscillator.frequency.value = 500;
  oscillator.connect(gainNode);
  oscillator.start(audioCtx.currentTime);
  oscillator.stop(audioCtx.currentTime + duration);
  //---------------------------------------------------------------------
}
    </script>
  </body>
  <!-- ===================================================================== -->

</html>
person fdcpp    schedule 31.12.2019
comment
крутой чувак, но я играю в аудио элемент, как это работает, не могли бы вы увидеть обновленный код - person Mike; 01.01.2020
comment
GainNode не подключается к panner, мне нужно установить громкость - person Mike; 01.01.2020
comment
@Mike, вероятно, было бы проще иметь базовый автономный рабочий пример того, что у вас есть в качестве jsfiddle. - person fdcpp; 01.01.2020
comment
значит, пока у меня есть вопрос, можем ли мы установить уровень громкости панорамирования? - person Mike; 01.01.2020
comment
Вы должны установить громкость GainNode перед PannerNode. Думайте об этом как о той же цепи сигналов, которую вы найдете на микшерном пульте. - person fdcpp; 01.01.2020
comment
jsfiddle.net/ovwmundc в этом примере вы можете изменить его, если я хочу воспроизвести это (old.harappa.com/gandhi.mp3) аудио при загрузке, и когда нажимается кнопка "Мне", просто уменьшите громкость мне было бы достаточно заранее спасибо очень ценный человек (Y) - person Mike; 01.01.2020
comment
На самом деле я рекомендую, если вы хотите сделать что-то интерактивное с WebAudio, вам, вероятно, лучше использовать Звуковая библиотека P5. Он должен заботиться о том, какие вызовы функций выполнять независимо от браузера, с дополнительным преимуществом, заключающимся в том, что вам не нужно поддерживать библиотеку. Кроме того, панорамирование и загрузка SoundFile уже реализованы с примерами, что больше, чем может можно сказать о документах Webkit/MDN. - person fdcpp; 03.01.2020
comment
если (audioCtx.createStereoPanner) { var panner = audioCtx.createPanner(); panner.pan.value = панорамирование; } . . . Разве это не должно быть audioCtx.createStereoPanner(); - person Paul John Leonard; 16.06.2020