Clever Geek Handbook

How to crop an image using jquery plugin

Jquery cover image with form

I want a system that can crop images in different ways, I've seen a site like relizar achieve. Any idea how this is done?

I searched for plugins, but I didn't give myself the opportunity to adapt in a certain way.

considers

here

+3


source to share


1 answer


I searched for "cropping a polygon image" and found several other StackOverflow answers as well as some source code on GitHub. Check them out:

Cropping images must be done on the server side. The first answer provides some sample code written in PHP.



The client side idea is you draw a polygon around the area you want to crop, which is represented by the vertex list. Then you can send the image and the vertex list to the server for image processing.

Using the vertices, the server can create an image mask. It ends up acting like a kind of binary filter: things remain inside the form, everything else becomes transparent. Then you can send this back to the client.

This will work great for rectangular polygons, I suppose the support curves will be much more complex. And any smart rig will start requiring edge detection and possibly some machine learning. Aside from the simplified cropping, it gets difficult!

+3


source






More articles:


All Articles