W3cubDocs

/DOM

BaseAudioContext.createGain

The createGain() method of the BaseAudioContext interface creates a GainNode, which can be used to control the overall gain (or volume) of the audio graph.

Syntax

var gainNode = AudioContext.createGain();

Return value

A GainNode which takes as input one or more audio sources and outputs audio whose volume has been adjusted in gain (volume) to a level specified by the node's GainNode.gain a-rate parameter.

Example

The following example shows basic usage of an AudioContext to create a GainNode, which is then used to mute and unmute the audio when a Mute button is clicked by changing the gain property value.

The below snippet wouldn't work as is — for a complete working example, check out our Voice-change-O-matic demo (view source.)

<div>
  <a class="mute">Mute button</a>
</div>
var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
var gainNode = audioCtx.createGain();
var mute = document.querySelector('.mute');
var source;

if (navigator.mediaDevices.getUserMedia) {
 navigator.mediaDevices.getUserMedia (
   // constraints - only audio needed for this app
   {
     audio: true
   },

   // Success callback
   function(stream) {
     source = audioCtx.createMediaStreamSource(stream);

   },

   // Error callback
   function(err) {
     console.log('The following gUM error occured: ' + err);
   }
  );
} else {
   console.log('getUserMedia not supported on your browser!');
}

source.connect(gainNode);
gainNode.connect(audioCtx.destination);

  ...

mute.onclick = voiceMute;

function voiceMute() {
  if(mute.id == "") {
    gainNode.gain.setValueAtTime(0, audioCtx.currentTime);
    mute.id = "activated";
    mute.innerHTML = "Unmute";
  } else {
    gainNode.gain.setValueAtTime(1, audioCtx.currentTime);
    mute.id = "";
    mute.innerHTML = "Mute";
  }
}

Specifications

Browser compatibilityUpdate compatibility data on GitHub

Desktop
Chrome Edge Firefox Internet Explorer Opera Safari
Basic support 10
Prefixed
10
Prefixed
Prefixed Requires the vendor prefix: webkit
Yes 25 No 22
22
15
Prefixed
Prefixed Requires the vendor prefix: webkit
6
Prefixed
6
Prefixed
Prefixed Requires the vendor prefix: webkit
Mobile
Android webview Chrome for Android Edge Mobile Firefox for Android Opera for Android iOS Safari Samsung Internet
Basic support Yes 33 Yes 26 Yes No ?

See also

© 2005–2018 Mozilla Developer Network and individual contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/BaseAudioContext/createGain