Howler.js: Generate a dynamic waveform like in the the Sprite example
Hi @goldfire,
how do you generate a waveform like this example: https://github.com/goldfire/howler.js/tree/master/examples/sprite
I don't see anything in the example code on how it was generated.
noncototient
All 2 comments
Unfortunately, I can't remember exactly how I made that. I just remember searching around for a tool that could generate waveforms from an audio file and then tweaking it in Photoshop.
goldfire
on 13 Feb 2017
There is a script called WaveSurfer.
And with some scripting one can use it with howler instead of its player. See here. ...
Note I modified my edition of howler to accept a raw ArrayBuffer, and to export its decoded AudioBuffer via obj._decoded., but this is not necessary. I just did it to save some CPU cycles (rather than Base64 encoding to a data URL then having both Howler and WaveSurfer decode it separately (3 functions wasted there, encoding and decoding twice).
What I've done with WaveSurfer can still be done without modifying Howler. That said, if you wish, feel free to use my edition. WaveSurfer was not modified on my end, only Howler.
zefie
on 20 Feb 2017
Related issues
sibelius
路
3Comments
joshbruce
路
4Comments
kamkha
路
3Comments
indexofrefraction
路
4Comments
bflora2
路
4Comments
Most helpful comment
There is a script called WaveSurfer.
And with some scripting one can use it with howler instead of its player. See here. ...
Note I modified my edition of howler to accept a raw ArrayBuffer, and to export its decoded AudioBuffer via obj._decoded., but this is not necessary. I just did it to save some CPU cycles (rather than Base64 encoding to a data URL then having both Howler and WaveSurfer decode it separately (3 functions wasted there, encoding and decoding twice).
What I've done with WaveSurfer can still be done without modifying Howler. That said, if you wish, feel free to use my edition. WaveSurfer was not modified on my end, only Howler.