Class: TraceDisplay

Constructor

new TraceDisplay(options)

Parameters:

Name	Type	Description
options	Object	Override default parameters. Properties Name Type Attributes Default Description color String <optional> 'orange' Color. colorScheme String <optional> 'none' If a third value is available in the input, can be used to control the opacity or the hue. If input frame size is 2, this param is automatically set to none 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 duration Number <optional> 1 Duration (in seconds) represented in the canvas. dynamic 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/TraceDisplay.js, line 83

Example

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

const AudioContext = (window.AudioContext || window.webkitAudioContext);
const audioContext = new AudioContext();

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

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

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

  // not sure it make sens but...
  const meanStddev = new lfo.operator.MeanStddev();

  const traceDisplay = new lfo.sink.TraceDisplay({
    canvas: '#trace',
  });

  const logger = new lfo.sink.Logger({ data: true });

  audioInNode.connect(meanStddev);
  meanStddev.connect(traceDisplay);

  audioInNode.start();
}