Skip to content
master
Go to file
Code

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time

README.md

webaudio-examples

Code examples that accompany the MDN Web Audio documentation https://developer.mozilla.org/en-US/docs/Web/API/Web_Audio_API

AnalyserNode

The audio-analyser directory contains a very simple example showing a graphical visualization of an audio signal drawn with data taken from an AnalyserNode. Run the demo live.

Audio Basics

The audio-basics directory contains a fun example showing a retro-style "boombox" that allows audio to be played, stereo-panned, and volume-adjusted. Run the demo live.

AudioBuffer

The audio-buffer directory contains a very simple example showing how to use an audio buffer in the Web Audio API. Run the demo live.

AudioParam

The audio-param directory contains some simple examples showing how to use the methods of the Web Audio API AudioParam interface. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/AudioParam. Run example live.

AudioContext States

The audiocontext-states directory contains a simple demo of the new Web Audio API AudioContext states, including the states property and the close(), resume() and suspend() methods. See https://developer.mozilla.org/en-US/docs/Web/API/AudioContext for more details. Run the demo live.

Compressor Example

The compressor-example directory contains a simple demo to show usage of the Web Audio API createDynamicsCompressor() method and DynamicsCompressorNode. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createDynamicsCompressor. Run the example live.

createMediaStreamDestination

The create-media-stream-destination directory contains a simple example showing how the Web Audio API AudioContext.createMediaStreamDestination can be used to output a stream - in this case to a MediaRecorder instance, to output a sinewave to an opus file. Run the demo live.

decodeAudioData

The decode-audio-data directory contains a simple example demonstrating usage of the Web Audio API decodeAudioData() method. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/decodeAudioData. View example live.

IIRFilterNode

The iirfilter-node directory contains an example showing usage of an IIRFilterNode. Run the demo live.

createMediaElementSource

The media-source-buffer directory contains a simple example demonstrating usage of the Web Audio API AudioContext.createMediaElementSource() method. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaElementSource or view the demo live.

OfflineAudioContext

The offline-audio-context directory contains a simple example to show how a Web Audio API OfflineAudioContext object can be used to rapidly process/render audio in the background to create a buffer, which can then be used in any way you please. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext. Run example live.

OfflineAudioContext Promise

The offline-audio-context-promise directory contains a simple example to show how a Web Audio API OfflineAudioContext object can be used to rapidly process/render audio in the background to create a buffer, which can then be used in any way you please. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/OfflineAudioContext/startRendering(promise). Run the example live.

PannerNode

The panner-node directory contains a demo to show basic usage of a Web Audio API PannerNode to control audio spatialization. See https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createPanner for more details. Run the example live.

ScriptProcessorNode

The script-processor-node directory contains a simple demo showing how to use the Web Audio API's ScriptProcessorNode to process a loaded audio track, adding a little bit of white noise to each audio sample. For more information see ScriptProcessorNode documentation and the live demo.

Step Sequencer

The step-sequencer directory contains a simple step-sequencer that loops and manipulates sounds based on a dial-up modem. For more information see Advanced techniques: creating sound, sequencing, timing, scheduling. See the live demo also.

StereoPannerNode

The stereo-panner-node directory contains a simple example to show how the Web Audio API StereoPannerNode can be used to pan an audio stream. See https://developer.mozilla.org/en-US/docs/Web/API/StereoPannerNode for more details. Run the example live.

createMediaStreamSource

The stream-source-buffer directory contains a simple example demonstrating usage of the Web Audio API AudioContext.createMediaElementSource() method. For more information, see https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/createMediaStreamSource. View example live.

You can’t perform that action at this time.