Weird interaction between image and resize filters

[melchiar]

Version

2.4.1

Test Case

https://jsfiddle.net/melchiar/hwrs1bzd/

Information about environment

Browser
tested on Chrome & Firefox

Steps to reproduce

1. Apply both an image filter and resizeFilter to an image.
2. Shrink the image using the corner controls
3. Serialize, then load the canvas by clicking the 'To JSON', then 'Load JSON' buttons

Expected Behavior

The image should resize as expected while keeping the image filter. The stringified canvas should also load exactly as it appeared before being serialized.

Actual Behavior

Shrinking the image beyond a certain point causes the image filter to disappear. When the canvas is serialized and then loaded while in this state, the loaded canvas makes the image filter work again, but the image becomes cropped. If you resize the image again, the cropping disappears, but so does the image filter.

[asturur]

Thanks for the bug report. i ll look at it.

[melchiar]

Thanks @asturur. Just a note that the cropping issue doesn't seem to be present on HiDPI displays so I expect it's related to retina scaling. The image filter issue is present on all devices I've tested.

[asturur]

https://jsfiddle.net/hwrs1bzd/43/

While the Load from JSON looks like a bug, the filter interaction was fixed recently. Can you check if you can make the filter disappear on the fiddle based on 2.4.1?

[asturur]

the fiddle is 2.3.4 based while 2.3.5 changelog:

[melchiar]

Thanks @asturur, you're right the disappearing filter issue is fixed in later releases (I used an older fiddle as a starting point so I must have missed updating to the latest release). The fiddle was only intended to isolate the load from JSON issue which I came across in my project running 2.4.1.

[asturur]

Load from JSON is now solved too.

[melchiar]

Yeah, I saw the PR, thanks for the quick fix. I've been putting off using resizefilters in my project so I'm hoping this week I'll be able to make use of this excellent feature (some images definitely suffer without it)

[asturur]

i have seen in your code you select hermite, remember that if the browser is in webgl mode, the only algorithm we have available is lanzcos. In that case select a filter window that makes sense for your project ( depending on what kind of ratio of shrinking you expect to find )

[melchiar]

Great tip! It'd be great to improve some of the documentation on resizefilters at some point. I'd write a wiki but I fear my understanding is still too limited