Как установить громкость звука HTML5?

в игре HTML5, которую я делаю, я играю звук "глухой", когда вещи сталкиваются. Однако это немного нереалистично. Независимо от скорости объектов, они всегда будут издавать один и тот же, относительно громкий "глухой" звук. Я бы хотел, чтобы громкость звука зависела от скорости, но как это сделать? Я знаю только как играть звук.

playSound = function(id)
{
    sounds[id].play();
}

sounds массив полный new Audio("url") ' s.

3 ответов


используйте свойство громкости аудиоэлемента. От W3:

эффективным объемом носителя элемента является объем, интерпретируемый относительно в диапазоне от 0.0 до 1.0, 0.0 молчать, и 1.0 быть самая громкая настройка, значения между увеличением громкости. Диапазон не обязательно быть линейным. Самая громкая настройка может быть ниже, чем у системы самая громкая возможная настройка; например, пользователь мог установить максимальный объем.

Ex:sounds[id].volume=.5;


вы можете настроить громкость, установив:

setVolume = function(id,vol) {
    sounds[id].volume = vol; // vol between 0 and 1
}

Однако имейте в виду, что существует небольшая задержка между заданным объемом и его вступлением в силу. Вы можете услышать, как звук начинает играть на предыдущей громкости, а затем перейти к новой.


вы даже можете играть с усилением и сделать громкость громче, чем 100%. Вы можете использовать эту функцию для усиления звука:

function amplifyMedia(mediaElem, multiplier) {
  var context = new (window.AudioContext || window.webkitAudioContext),
      result = {
        context: context,
        source: context.createMediaElementSource(mediaElem),
        gain: context.createGain(),
        media: mediaElem,
        amplify: function(multiplier) { result.gain.gain.value = multiplier; },
        getAmpLevel: function() { return result.gain.gain.value; }
      };
  result.source.connect(result.gain);
  result.gain.connect(context.destination);
  result.amplify(multiplier);
  return result;
}

вы можете сделать что-то вроде этого, чтобы установить начальное усиление на 100%:

var amp = amplifyMedia(sounds[id], 1);

тогда, если вам нужен звук в два раза громче, вы могли бы сделать что-то вроде этого:

amp.amplify(2);

если вы хотите половину, вы можете сделать это:

amp.amplify(0.5);

найдена полная запись функции здесь: http://cwestblog.com/2017/08/17/html5-getting-more-volume-from-the-web-audio-api/