EZ Web Audio

Appearance

EZ Web Audio / Analyzer

Class: Analyzer ​

Defined in: packages/core/src/analyzer.ts:61

Analyzer class for audio visualization.

Wraps the Web Audio AnalyserNode with a convenient API for getting frequency and waveform data. Uses pre-allocated typed arrays for zero-allocation polling.

Example ​

typescript
const analyzer = createAnalyzer(audioContext, { fftSize: 2048 })
sound.setAnalyzer(analyzer)

function draw() {
  const freqData = analyzer.getFrequencyData()
  // Draw frequency bars using freqData values (0-255)

  const waveData = analyzer.getTimeDomainData()
  // Draw oscilloscope waveform using waveData (128 = zero crossing)

  requestAnimationFrame(draw)
}
draw()

Constructors ​

Constructor ​

new Analyzer(audioContext, options?): Analyzer

Defined in: packages/core/src/analyzer.ts:73

Parameters ​

audioContext ​

AudioContext

options? ​

AnalyzerOptions

Returns ​

Analyzer

Properties ​

input ​

readonly input: AnalyserNode

Defined in: packages/core/src/analyzer.ts:66

The underlying AnalyserNode. Connect audio to this node for analysis. Use this as the input when integrating with effect chains.

Accessors ​

fftSize ​

Get Signature ​

get fftSize(): number

Defined in: packages/core/src/analyzer.ts:113

The FFT size used for frequency analysis. Must be a power of 2 between 32 and 32768.

Returns ​

number

Set Signature ​

set fftSize(value): void

Defined in: packages/core/src/analyzer.ts:117

Parameters ​
value ​

number

Returns ​

void

frequencyBinCount ​

Get Signature ​

get frequencyBinCount(): number

Defined in: packages/core/src/analyzer.ts:105

The number of data points available for visualization. Equal to fftSize / 2.

Returns ​

number

maxDecibels ​

Get Signature ​

get maxDecibels(): number

Defined in: packages/core/src/analyzer.ts:143

Maximum decibel value for frequency data scaling.

Returns ​

number

Set Signature ​

set maxDecibels(value): void

Defined in: packages/core/src/analyzer.ts:147

Parameters ​
value ​

number

Returns ​

void

minDecibels ​

Get Signature ​

get minDecibels(): number

Defined in: packages/core/src/analyzer.ts:132

Minimum decibel value for frequency data scaling.

Returns ​

number

Set Signature ​

set minDecibels(value): void

Defined in: packages/core/src/analyzer.ts:136

Parameters ​
value ​

number

Returns ​

void

smoothingTimeConstant ​

Get Signature ​

get smoothingTimeConstant(): number

Defined in: packages/core/src/analyzer.ts:154

Smoothing time constant (0-1). Higher values smooth data over time.

Returns ​

number

Set Signature ​

set smoothingTimeConstant(value): void

Defined in: packages/core/src/analyzer.ts:158

Parameters ​
value ​

number

Returns ​

void

Methods ​

getFloatFrequencyData() ​

getFloatFrequencyData(): Float32Array

Defined in: packages/core/src/analyzer.ts:229

Get precise frequency data as Float32Array with dB values. Use when you need accurate dB readings rather than normalized 0-255 values.

Values are in decibels, typically ranging from minDecibels to maxDecibels.

Returns ​

Float32Array

Float32Array of dB values (same reference, use immediately or copy)

Example ​

typescript
const data = analyzer.getFloatFrequencyData()
const peakDb = Math.max(...data)
console.log(`Peak frequency at ${peakDb} dB`)

getFrequencyData() ​

getFrequencyData(): Uint8Array

Defined in: packages/core/src/analyzer.ts:183

Get frequency data as unsigned byte array (0-255). Call this in requestAnimationFrame for smooth animations.

Each value represents the amplitude at that frequency bin. Lower indices = lower frequencies, higher indices = higher frequencies.

Returns ​

Uint8Array

Uint8Array of frequency amplitudes (same reference, use immediately or copy)

Example ​

typescript
function draw() {
  const data = analyzer.getFrequencyData()
  for (let i = 0; i < data.length; i++) {
    const barHeight = data[i] / 255 * canvas.height
    // Draw bar at position i with height barHeight
  }
  requestAnimationFrame(draw)
}

getTimeDomainData() ​

getTimeDomainData(): Uint8Array

Defined in: packages/core/src/analyzer.ts:209

Get waveform (time domain) data as unsigned byte array. Call this in requestAnimationFrame for oscilloscope visualization.

Value of 128 represents zero crossing (silence). Values above 128 = positive amplitude, below 128 = negative amplitude.

Returns ​

Uint8Array

Uint8Array of waveform samples (same reference, use immediately or copy)

Example ​

typescript
function draw() {
  const data = analyzer.getTimeDomainData()
  for (let i = 0; i < data.length; i++) {
    const y = data[i] / 255 * canvas.height
    // Draw point at (i, y) for oscilloscope line
  }
  requestAnimationFrame(draw)
}