1.0.7 • Published 3 years ago
audio-visualiser v1.0.7
<audio-visualiser>
FFT Audio Analyser visuals ready for retina displays.
Note: Uses ResizeObserver. Polyfill it on your end.
API
Inputs
| Method | Description | Related media event |
|---|---|---|
set analyser | Set analyser to read data from. | |
start() | Start the visuals drawing loop. | play |
stop() | Stop the visuals drawing loop. | pause / ended |
| Attribute | Description |
|---|---|
color | Sets the color of the visual. |
Usage
Install audio-visualiser via npm or import it in your ES module supported browser with import 'https://unpkg.com/audio-visualiser?module';
Create an AnalyserNode and connect it to by calling the setter analyser on the instance of the custom element. document.querySelector('audio-visualiser').analyser = yourAnalyserNode;. For a little live demo of this you can check out https://enjikaka.github.io/audio-visualiser/. Open dev tools or view-source to see how the tag is set up to the analyser via createMediaElementSource.