Waveform
Options
Property | Type | Default | Description |
---|---|---|---|
backgroundColor | string | null | A string containing any hexadecimal, rgb, or named color |
color | string | #ffffff | A string containing any hexadecimal, rgb, or named color |
style | string | bars | One of bars , bricks , curve , equalizer , line , pixel , roundBars , wave |
Waveform Styles
We have a wide variety of waveform styles to chooose from, and more to come!
bars
roundBars
bricks
equalizer
curve
line
pixel
wave
Waveform layer configuration
The config
argument supports the following layer configuration properties:
Reading and updating layer options
waveform.setBackgroundColor("#ffffff");
waveform.backgroundColor; // "#ffffff"
waveform.setColor("#000000");
waveform.color; // "#000000"
waveform.setStyle("equalizer");
waveform.style; // "equalizer"
Examples
Add waveform linked to audio file
await composition.addWaveform(
"https://editframe.com/docs/"
);
Full layer configuration
await composition.addWaveform(
"https://editframe.com/docs/",
{ backgroundColor: "#00775b", color: "#2f2649", style: "equalizer" },\n
{
position: {
x: 50,
y: 50,
},
size: {
height: 980,
width: 1930,
},
timeline: {
start: 1,
},
trim: {
start: 0,
end: 4,
},
}
);