Constructor
new MarkerDisplay(options)
Parameters:
Name |
Type |
Description |
options |
Object
|
Override default parameters.
Properties
Name |
Type |
Attributes |
Default |
Description |
color |
String
|
|
|
Color of the marker. |
thresholdIndex |
Number
|
<optional>
|
0
|
Index of the incomming frame
data to compare against the threshold. Should be used in conjonction with
threshold . |
threshold |
Number
|
<optional>
|
null
|
Minimum value the incomming value
must have to trigger the display of a marker. If null each incomming event
triggers a marker. Should be used in conjonction with thresholdIndex . |
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. This parameter only exists for operators that display several
consecutive frames on 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. This parameter only exists
for operators that display several consecutive frames on the canvas. |
|
- Source:
Example
import * as lfo from 'waves-lfo/client';
const eventIn = new lfo.source.EventIn({
frameType: 'scalar',
});
const marker = new lfo.sink.MarkerDisplay({
canvas: '#marker',
threshold: 0.5,
});
eventIn.connect(marker);
eventIn.start();
let time = 0;
const period = 1;
(function generateData() {
eventIn.process(time, Math.random());
time += period;
setTimeout(generateData, period * 1000);
}());