Component Preview
Interactive demonstration of the EQDisplay component
🎛️ Interactive Controls
Component Overview
The EQDisplay component provides real-time visual representation of audio equalizer data, allowing users to see frequency response and audio levels at a glance.
This interactive demo allows you to explore all the features and capabilities of the EQDisplay component. Use the controls above to test the component's functionality and see how it integrates with other audio visualization components.
API Reference
The EQDisplay component provides a comprehensive API for integration into your applications.
Properties: Configure the component with various properties to customize appearance and display behavior.
Methods: Programmatically control the equalizer display using built-in methods for updating frequency data.
Events: Listen to component events to respond to display updates and user interactions.
Component Events
The EQDisplay component emits various events that you can listen to:
• Frequency Update: Fired when new frequency data is received
• Level Change: Fired when audio levels change
• Display Refresh: Fired when the visual display is updated
• Range Change: Fired when frequency range settings change
View the Event Log tab to see real-time events as they occur.
Usage Examples
Here are some common ways to use the EQDisplay component in your projects:
Basic Usage:<eqdisplay></eqdisplay>
With Properties:<eqdisplay bands="10" range="20-20000"></eqdisplay>
Event Listeners:eqDisplay.addEventListener('frequency-update', handleFrequencyUpdate);