Class: WaveformDisplay

Constructor

new WaveformDisplay(options)

Parameters:

Name	Type	Description
options	Object	Override default parameters. Properties Name Type Attributes Default Description colors Array.<String> <optional> ['waveform', 'rms'] Array containing the color codes for the waveform (index 0) and rms (index 1). dynamic parameter rms Boolean <optional> false Set to true to display the rms. dynamic parameter duration Number <optional> 1 Duration (in seconds) represented in the canvas. dynamic parameter min Number <optional> -1 Minimum value represented in the canvas. dynamic parameter max Number <optional> 1 Maximum value represented in the canvas. dynamic parameter width Number <optional> 300 Width of the canvas. dynamic parameter height Number <optional> 150 Height of the canvas. dynamic parameter container Element | CSSSelector <optional> null Container element in which to insert the canvas. constant parameter canvas Element | CSSSelector <optional> null Canvas element in which to draw. constant parameter referenceTime Number <optional> null Optionnal reference time the display should considerer as the origin. Is only usefull when synchronizing several display using the DisplaySync class.

Source:

• client/sink/WaveformDisplay.js, line 79

Example

import * as lfo from 'waves-lfo/client';

const audioContext = new window.AudioContext();

navigator.mediaDevices
  .getUserMedia({ audio: true })
  .then(init)
  .catch((err) => console.error(err.stack));

function init(stream) {
  const audioIn = audioContext.createMediaStreamSource(stream);

  const audioInNode = new lfo.source.AudioInNode({
    audioContext: audioContext,
    sourceNode: audioIn,
    frameSize: 512,
  });

  const waveformDisplay = new lfo.sink.WaveformDisplay({
    canvas: '#waveform',
    duration: 3.5,
    rms: true,
  });

  audioInNode.connect(waveformDisplay);
  audioInNode.start();
});