Filter
- Name
name- Type
- string
- required
- Description
A string name of one of the supported filters
- Name
options- Type
- object
- Description
An object used to configure one of the configurable filters
Reading and updating layer options
filter.setFilter({ name: 'brightness', options: { brightness: 1.1 })
filter.name; // "brightness"
filter.options; // { brightness: 1.1 }
The following filters are currently supported:
| Filter name | Configurable |
|---|
brightness | ✓️ |
contrast | ✓ |
fadein | ✓ |
fadeout | ✓ |
grayscale | |
lighten | |
negative | |
saturation | ✓ |
sobel | |
vintage | |
brightness options
| Option | Type | Description |
|---|
brightness | number | A number between -1 and 1 |
contrast options
| Option | Type | Description |
|---|
contrast | number | A number between -1000 and 1000 |
fadein options
| Option | Type | Description |
|---|
color | string | Any hexadecimal, rgb, or named color |
duration | number | Fade length in seconds |
startTime | number | The time in the composition, in seconds, at which to start the fade |
fadeout options
| Option | Type | Description |
|---|
color | string | Any hexadecimal, rgb, or named color |
duration | number | Fade length in seconds |
startTime | number | The time in the composition, in seconds, at which to start the fade |
saturation options
| Option | Type | Description |
|---|
saturation | number | A number between 0 and 3 |
Brightness & Grayscale
await composition.addVideo(
"https://editframe.com/docs/composition/layers/filter/puppy-beach.mp4"
);
composition.addFilter({ name: "grayscale" });
composition.addFilter({
name: "brightness",
options: { brightness: 0.5 }
});
await composition.addVideo(
"https://editframe.com/docs/composition/layers/filter/puppy-beach.mp4"
);
composition.addFilter({
name: "contrast",
options: { contrast: 42 }
});
await composition.addVideo(
"https://editframe.com/docs/composition/layers/filter/puppy-beach.mp4"
);
composition.addFilter({
name: "fadein",
options: {
color: "#2f2649",
duration: 2,
startTime: 0,
},
});
await composition.addVideo(
"https://editframe.com/docs/composition/layers/filter/puppy-beach.mp4"
);
composition.addFilter({
name: "fadeout",
options: {
color: "#2f2649",
duration: 2,
startTime: 0,
},
});
await composition.addVideo(
"https://editframe.com/docs/composition/layers/filter/puppy-beach.mp4"
);
composition.addFilter({
name: "saturation",
options: {
saturation: 2,
},
});
