Come impostare il volume dell'audio HTML5?

Question

In un gioco HTML5 che sto creando, suono un "tonfo" quando le cose si scontrano. Tuttavia, è un po 'irrealistico. Non importa la velocità degli oggetti, faranno sempre lo stesso suono "tonfo" relativamente forte. Quello che mi piacerebbe fare è che il volume di quel suono dipenda dalla velocità, ma come faccio? So solo come suonare un suono.

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

sounds è una gamma completa di new Audio("url") 's.

Answer 1

Utilizzare la proprietà del volume dell'elemento audio. Da 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.

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

Answer 2

È possibile regolare il volume impostando:

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

Tuttavia, tenere a mente che c'è un piccolo ritardo tra il volume viene impostato, e ha effetto. Potresti sentire il suono iniziare a suonare al volume precedente, quindi saltare a quello nuovo.

Answer 3

È possibile persino giocare con il guadagno e far suonare il volume più del 100%. È possibile utilizzare questa funzione per amplificare il suono:

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; 
} 

Si potrebbe fare qualcosa di simile per impostare l'amplificazione iniziale al 100%:

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

Allora se è necessario il suono di essere due volte più forte si potrebbe fare qualcosa di simile:

amp.amplify(2); 

Se si vuole la metà che si può fare questo:

amp.amplify(0.5); 

Una scrittura completo della funzione si trova qui: http://cwestblog.com/2017/08/17/html5-getting-more-volume-from-the-web-audio-api/