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

Question

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

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

sounds массив полон new Audio("url") «с.

Answer 1

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

The element's effective media volume is volume, interpreted relative to the range 0.0 to 1.0, with 0.0 being silent, and 1.0 being the loudest setting, values in between increasing in loudness. The range need not be linear. The loudest setting may be lower than the system's loudest possible setting; for example the user could have set a maximum volume.

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

Answer 2

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

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

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

Answer 3

Вы можете даже поиграть с коэффициентом усиления и громкостью громче, чем 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/