Class: Convolute

fabric.Image.filters.Convolute

new Convolute()

Adapted from html5rocks article
Source:
See:
Examples

Sharpen filter

var filter = new fabric.Image.filters.Convolute({
  matrix: [ 0, -1,  0,
           -1,  5, -1,
            0, -1,  0 ]
});
object.filters.push(filter);
object.applyFilters(canvas.renderAll.bind(canvas));

Blur filter

var filter = new fabric.Image.filters.Convolute({
  matrix: [ 1/9, 1/9, 1/9,
            1/9, 1/9, 1/9,
            1/9, 1/9, 1/9 ]
});
object.filters.push(filter);
object.applyFilters(canvas.renderAll.bind(canvas));

Emboss filter

var filter = new fabric.Image.filters.Convolute({
  matrix: [ 1,   1,  1,
            1, 0.7, -1,
           -1,  -1, -1 ]
});
object.filters.push(filter);
object.applyFilters(canvas.renderAll.bind(canvas));

Emboss filter with opaqueness

var filter = new fabric.Image.filters.Convolute({
  opaque: true,
  matrix: [ 1,   1,  1,
            1, 0.7, -1,
           -1,  -1, -1 ]
});
object.filters.push(filter);
object.applyFilters(canvas.renderAll.bind(canvas));

Extends

Members

type

Filter type
Overrides:
Default Value:
  • Convolute
Source:

Methods

applyTo(canvasEl)

Applies filter to canvas element
Parameters:
Name Type Description
canvasEl Object Canvas element to apply filter to
Source:

initialize(optionsopt)

Constructor
Parameters:
Name Type Attributes Description
options Object <optional>
Options object
Properties
Name Type Attributes Default Description
opaque Boolean <optional>
false Opaque value (true/false)
matrix Array <optional>
Filter matrix
Overrides:
Source:

setOptions(optionsopt)

Sets filter's properties from options
Parameters:
Name Type Attributes Description
options Object <optional>
Options object
Inherited From:
Source:

toJSON() → {Object}

Returns a JSON representation of an instance
Inherited From:
Source:
Returns:
JSON
Type
Object

toObject() → {Object}

Returns object representation of an instance
Overrides:
Source:
Returns:
Object representation of an instance
Type
Object