Generating sound on the fly with javascript/html5

by

You can use the Web Audio API in most browsers now (excepting IE and Opera Mini).

Try out this code:

// one context per document
var context = new (window.AudioContext || window.webkitAudioContext)();
var osc = context.createOscillator(); // instantiate an oscillator
osc.type="sine"; // this is the default - also square, sawtooth, triangle
osc.frequency.value = 440; // Hz
osc.connect(context.destination); // connect it to the destination
osc.start(); // start the oscillator
osc.stop(context.currentTime + 2); // stop 2 seconds after the current time

If you want the volume lower, you can do something like this:

var context = new webkitAudioContext();
var osc = context.createOscillator();
var vol = context.createGain();

vol.gain.value = 0.1; // from 0 to 1, 1 full volume, 0 is muted
osc.connect(vol); // connect osc to vol
vol.connect(context.destination); // connect vol to context destination
osc.start(context.currentTime + 3); // start it three seconds from now

I got most of this from experimenting in chromium while reading the Web Audio API Working Draft, which I found from @brainjam ‘s link.

Lastly, it is very helpful to inspect the various objects in the chrome inspector (ctrl-shift-i).

More Related Contents:

  1. HTML 5 video or audio playlist
  2. Node.js can’t create Blobs?
  3. How to prevent “The play() request was interrupted by a call to pause()” error?
  4. HTML5 check if audio is playing?
  5. Access microphone from a browser – Javascript
  6. Why don’t audio and video events bubble?
  7. How to mute all sound in a page with JS?
  8. How to play a notification sound on websites?
  9. html5 display audio currentTime
  10. HTML 5 – Play file at certain time point
  11. HTML5 playback with fade in and fade out
  12. gapless looping audio html5
  13. How to capture generated audio from window.speechSynthesis.speak() call?
  14. Why aren’t Safari or Firefox able to process audio data from MediaElementSource?
  15. How to play only the audio of a Youtube video using HTML 5?
  16. How to toggle audio play() pause() with one button or link?
  17. Is there a way to use the Web Audio API to sample audio faster than real-time?
  18. HTML5 audio playlist – how to play a second audio file after the first has ended?
  19. How to check if HTML5 audio has reached different errors
  20. Javascript make audio blob
  21. How to set the loudness of HTML5 audio?
  22. No sound on iOS 6 Web Audio API
  23. How to implement something like this GIF that using mouse drag and select items
  24. Javascript counting all the characters from a HTML document
  25. Submit two forms with one button
  26. Is there a spec that the id of elements should be made global variable?
  27. How can I capture the right-click event in JavaScript? [duplicate]
  28. Infinity Loop Slider Concepts
  29. DOMException: Failed to load because no supported source was found
  30. why is jQuery click event firing multiple times

Leave a Comment