I use AudioContext's decodeAudioData on an mp3 file, which gives me an AudioBuffer. With this audio buffer, I go on to draw a waveform of this mp3 file on a canvas using the data returned by getChannelData().
Now I want to use the same code to draw a waveform of the audio data of a MediaStream, which means I need the same kind of input/data. I know a MediaStream contains real time information, but there must be a way to access each new data from the MediaStream as
a Float32Array containing the PCM data
which is what the AudioBuffer's getChannelData returns.
I tried to wrap the MediaStream with a MediaStreamAudioSourceNode and feed it into an AnalyserNode to use getFloatFrequencyData() (which returns a Float32Array), but I can tell the data is different from the data I get from getChannelData(). Maybe it isn't "PCM" data? How can I get "PCM" data?
Hopefully this is clear. Thanks for the help!
First, a note that AnalyserNode only samples the data occasionally, but won't process all of it. I think that matches your scenario well, but just know that if you need all the data (like, you're buffering up the audio), you will need to use ScriptProcessor instead today.
Presuming you just want samples of the data, you can use AnalyserNode, but you should call getFloatTimeDomainData(), not getFloatFrequencyData(). That will give you the PCM data (FrequencyData is giving you the FFT of the PCM data).