Multiple cropper box on single image with ngx-image-cropper

Viewed 1288

I am working with angular for image cropping task. Image is having multiple faces that need to be select on mouse click. How can we add multiple cropper box with npm package for angular 'ngx-image-cropper' or any other solution on this?

1 Answers

I don't think it is a good idea to have multiple crop boxes at the same time. Keep the source image on the screen and try to crop one by one. imageCropped event of ngx-image-cropper provides you the base64 image of the selected area. Example usage :

onImageCropped(event: ImageCroppedEvent) {
    console.log(event.base64);
}

Add a save button to the page and store the selection in an array. Use them whenever you need. You can also show them in a div and delete any of them.

Related