Class Filter

Creates a filter instance that lets apply various filters on every shape that extends the class.

Basically every [[ShapeModel]] has exposed [[ShapeModel.addFilter]] and [[ShapeModel.removeFilter]] to work with filters

Example

Adds a blur filter to background image

editor.board.background.image.addFilter({
 name: 'Blur',
 options: {
   blurRadius: 20
 }
})
Copy

Example

Adds blur and contrast filters to background image

editor.board.background.image.addFilter([
 {
   name: 'Blur',
   options: {
     blurRadius: 20
   }
 },
 {
   name: 'Contrast',
   options: {
     contrast: 30
   }
 }
])
Copy

Example

Adds a contrast filter to all selected shapes

editor.selection.addFilter({
 name: 'Contrast',
 options: {
   contrast: 30
 }
})
Copy

Example

Remove contrast filter of selected items

editor.selection.removeFilter({ name: Contrast' })
Copy

Example

Remove multiple filters

editor.selection.removeFilter([
 { name: Contrast' },
 { customFn: theFunction },
 { name: 'Contrast' }
])
Copy

Example

Adds a custom filter to background image

editor.selection.addFilter({
 customFn: imageData => theCustomFunction(imageData),
})
Copy

Example

Directly access to filters

editor.filters.apply([editor.board.background.image], {
 name: 'Grayscale',
})
Copy

Applies a filter to the given shapes

Remove filters of the given shapes