Wavething: Audio Waveforms
The app is live here! Try it out
with your own audio file.
Wavething is a simple app for creating and styling audio waveforms. Audio waveform charts display the volume of an audio file over time. When the wave is taller, the audio is louder.
This project was an experiment to see how well React and D3 work
together. Amelia Wattenberger’s post
about this topic was a great resource. I took the lazy approach and
cleared the SVG element in the useEffect hook on each data update. A
better way to do this would be to let D3 control data
entry/exit/updates instead of recreating the chart from scratch on
each update.
Tech
- React
- D3.js
- waveform-data.js