CODEWITHSUNDEEP
javascriptfabricjs
Rehmat
Rehmat

Reputation: 2299

Filters are missing from Fabric.js

I am working on CodePen and included Fabric.js in JavaScript settings. CodePen automatically bought version 2.4.4 for me: https://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.4.4/fabric.min.js

When I am trying to use for example the Tint filter, I am getting its not a constructor error in browser console.

But, the Tint filter is already available in the Fabric.js docs: http://fabricjs.com/docs/fabric.Image.filters.Tint.html

I also did: console.log(fabric.Image.filters); and the output is:

BaseFilter: ƒ i(), 
BlackWhite: ƒ i(), 
BlendColor: ƒ i(), 
BlendImage: ƒ i(), 
Blur: ƒ i(), 
Brightness: ƒ i(), 
Brownie: ƒ i(), 
ColorMatrix: ƒ i(), 
Composed: ƒ i(), 
Contrast: ƒ i(), 
Convolute: ƒ i(), 
Gamma: ƒ i(), 
Grayscale: ƒ i(), 
HueRotation: ƒ i(), 
Invert: ƒ i(), 
Kodachrome: ƒ i(), 
Noise: ƒ i(), 
Pixelate: ƒ i(), 
Polaroid: ƒ i(), 
RemoveColor: ƒ i(), 
Resize: ƒ i(), 
Saturation: ƒ i(), 
Sepia: ƒ i(), 
Technicolor: ƒ i(), 
Vintage: ƒ i()

As you can see Tint filter is not even available in filters.

Also, tried to use a version from fabricjs.com itself, using the download link at the bottom (Download version 2.4.3): http://cdnjs.cloudflare.com/ajax/libs/fabric.js/2.4.3/fabric.min.js

But, this version also has the same problem.

Upvotes: 1

Views: 909

Answers (1)

YaakovHatam
YaakovHatam

Reputation: 2344

I made some investigation to find where's tint filter gone. look at the commit: https://github.com/fabricjs/fabric.js/commit/e96ccf9ea64df529cbbbea869561a5a8da2cf1ac#diff-92d93b4f6664e4db62af0f12768dfe56R39

Tint isn't gone, but the code has changed, to use tint filter you should write:

var filter = new fabric.Image.filters.BlendColor({ color: 'red', mode: 'tint', alpha: 0.5 });

Upvotes: 1

Related Questions