aframe-audioanalyser-component
Advanced tools
Audio visualizations in A-Frame using Web Audio (AnalyserNode)
Audio visualizations for A-Frame using Web Audio (AnalyserNode).
These components mostly provide processed Web Audio data (beat detection,
levels, volume, waveform). How that is visualized is up to you (by writing
components that use this data to have a visual effect). Components will generally
implement the tick handler and read the analyser data. See the examples for
some example visualization components.
Not tested on mobile.
| Property | Description | Default Value |
|---|---|---|
| beatDetectionDecay | How fast to decay the beat threshold. | 0.99 |
| beatDetectionMinVolume | Minimum volume for beat. | 15 |
| beatDetectionThrottle | Minimum time to to wait between beats. | 250 |
| cache | Whether or not to cache audio buffers. | false |
| enableBeatDetection | Whether or not to detect beats. Disable if not using. | true |
| enableLevels | Whether or not to store frequency data. Disable if not using. | true |
| enableVolume | Whether or not to calculate average volume. Disable if not using. | true |
| enableWaveform | Whether or not to store waveform data. Disable if not using. | true |
| fftSize | Frequency domain. | 2048 |
| smoothingTimeConstant | How smooth the frequency data is returned. | 0.8 |
| src | Selector to an audio element or path to audio file. | '' |
| unique | Whether to share the audio instance with other visualizing entities. | false |
| Member | Description | Type |
|---|---|---|
| analyser | Web Audio AnalyserNode | AnalyserNode |
| volume | Whether or not to store frequency data. Disable if not using. | number |
| waveform | Whether or not to calculate average volume. Disable if not using. | Uint8Array |
| levels | Whether or not to store waveform data. Disable if not using. | Uint8Array |
To access the analyser node:
el.components.audioanalyser.analyser;
| Event Name | Description |
|---|---|
| audioanalyserbeat | Beat detected with beat detection. |
| audioanalyserready | AnalyserNode initialized. |
Install and use by directly including the browser files:
<head>
<title>Audio Visualizer</title>
<script src="https://aframe.io/releases/0.9.0/aframe.min.js"></script>
<script src="https://unpkg.com/aframe-audioanalyser-component@5.4.0/dist/aframe-audioanalyser-component.min.js"></script>
</head>
<body>
<a-scene>
<a-assets>
<audio id="song" src="rickroll.mp3" autoplay loop></audio>
</a-assets>
<a-entity
audioanalyser="src: #song"
component-that-does-stuff-with-audio-analyser-data
></a-entity>
</a-scene>
</body>
Install via NPM:
npm install aframe-audioanalyser-component
Then register and use.
require('aframe');
require('aframe-audioanalyser-component');
FAQs
Audio visualizations in A-Frame using Web Audio (AnalyserNode)
The npm package aframe-audioanalyser-component receives a total of 47 weekly downloads. As such, aframe-audioanalyser-component popularity was classified as not popular.
We found that aframe-audioanalyser-component demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
TypeScript is porting its compiler to Go, delivering 10x faster builds, lower memory usage, and improved editor performance for a smoother developer experience.
Research
Security News
The Socket Research Team has discovered six new malicious npm packages linked to North Korea’s Lazarus Group, designed to steal credentials and deploy backdoors.
Security News
Socket CEO Feross Aboukhadijeh discusses the open web, open source security, and how Socket tackles software supply chain attacks on The Pair Program podcast.