FabricJS Image.applyFilters trims image

By | January 27, 2020 | 0 Comment
Category: Javascript Tags:

Issue

When you apply filters to an image, it trims on the right or bottom part.

Cause

Internally by default image is painted over a tile of 2048×2048. If the height or width of the image is greater than 2048, remaining part of the image will be trimmed.

Fix

Increase textureSize to 4096 at the beginning of the code.

fabric.textureSize = 4096;

This means that fabric will now handle 4096×4096 image which is more than enough to handle a scanned legal/A4 paper with 300 dpi resolution.
More technical details can be found at http://fabricjs.com/fabric-filters


About Vishal Monpara

Vishal Monpara is a full stack Solution Developer/Architect with 13 years of experience primarily using Microsoft stack. He is currently working in Retail industry and moving 1's and 0's from geographically dispersed hard disks to geographically dispersed user leveraging geographically dispersed team members.