The Web Audio API provides a powerful and versatile system to control audio on the web. This
It can be used to add effects and filters to an audio source on the web. The audio source can be from the
<audio>, video/audio source files, or an audio network stream.
Let’s look at an example.
This example channels the audio from an
<audio> element to an
Sound effects (like panning) are added to the audio source before being channeled to the speakers’ audio output.
Init button calls the
init function when clicked. This will create an
AudioContext instance and set it to
Next, it creates a media source,
createMediaElementSource(audio), and passes the audio element as the audio source.
The volume node
volNode is created using
createGain. Here, we adjust the volume of the audio.
Next, the panning effect is set using the
Finally, the nodes are connected to the media source.
The buttons (
Stop) play, pause and stop the audio.
We have a volume and panning range slider. If these are changed, the volume and the panning effect of the audio are affected.
View all Courses