Play Multiple Tracks With The Web Audio API
NOTE : See also : id : 2ugi4q3u
I'm building an audio stem player like splitter.fm 1 using the Web Audio API 2 . The first step was building a prototype the plays multiple tracks in sync with each other. I did that by refining an example 3 from MDN.
HTML
The HTML page doesn't have much to it. It calls the javascript and provides a start button that can be used if the browser prevents autoplay.
Stem Player Test
Start
JavaScript Version 2
The first version is further below. Leaving it there for reference. This is the second version. Note that there's nothing here to make sure all the files are downloaded. The audio could start before they call come down, but they will sync up as soon as they are loaded.
let audioCtx = null;
const tracks = ;
const
document.;
JavaScript Version 1
The JavaScript does the heavy lifting with the Web Audio API. It expects two tracks at [TODO: Code shorthand span ] and [TODO: Code shorthand span ] . The primary function of this example is to show multiple tracks. I also added a panner module into the audio chain since that's what I need for what I'm doing.
let audioCtx = null;
const
const
let offset = 0;
document.;
[] TODO : Splitter.fm note
[] TODO : Web Audio Note
[] TODO : Multitrack example
Play multiple tracks and stems in sync with the Web Audio API