how to crop image with plugin jquery

Question

crop image jquery with shape

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

I searched plugins but I did not give myself the facility to adapt a particular way.

regards

here

Answer 1

I looked up 'polygonal image cropping' and found some other StackOverflow answers, as well as some source code on GitHub. Check these out:

• https://stackoverflow.com/a/25937649/683114
• https://stackoverflow.com/a/11714642/683114

Image cropping should be done on the server side. The first answer gives some example code done in PHP.

The idea is on the client side you draw a polygon around the area you want to crop, which is represented by a list of vertices. You could then send the image and the vertex list to the server for image processing.

Using the vertices, the server could build an image mask. This ends up acting as a sort of binary filter: things inside the shape stay, everything else is made transparent. Then you can send this back to the client.

This would work fine for straight-edged polygons, I imagine supporting curves would be a lot harder. And any kind of intelligent snapping would start requiring edge detection and maybe some machine learning. Beyond simplistic cropping, this gets difficult!