girliemac / filterous-2

Instagram-like photo manipulation library for Node.js and Javascript on browser
https://girliemac.github.io/filterous-2/demo-browser/
MIT License
206 stars 42 forks source link

Is it possible to receive filtered image? #1

Open ahromyak opened 7 years ago

ahromyak commented 7 years ago

I want to get filtered image to insert it in to canvas. is it possible with your lib?

girliemac commented 7 years ago

This lib does use a canvas to manipulate an image, then export as an image, but I didn't make the "invisible" canvas image exposed to the library...

However, you should be able to manually grab the filtered image src, and use canvas drawImage() to import the image into a new canvas.

See: https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/drawImage

BGitlin337 commented 6 years ago

Hey Girliemac, similar question here. I am looking for a way to feed a canvas to Filterous as an argument or global variable so that the filters can be applied directly to that. I am filtering large image sizes (up to 4K) on mobile, and the current Filterous loop I am having to do is a conversion of an existing canvas to a data URL, to then have Filterous create a new canvas, apply my image to it, apply the filter, convert it back to a data URL and then re-render that to my existing canvas. With testing, this has shown to be slow, especially on old mobile devices.

I tried editing your code myself to grab the canvas from a global variable but am having a hard time doing so.

Any thoughts on this?

Thanks, Brian