GetData & GetImageData should also return Zoom and Rotate properties

[JadaVonRuth]

Tihis work is briliant and I am happy I found it. I would like to add some recommendations. When a user modifies original picture via cropper and wants to process final changes on a file not by javascript but on server side via ajax or whatever, there would be great to have all properties that has changed since image was loaded. It means also rotation (degrees) and relative zoom against original in case there were used. Without it I cannot perform same visual changes in all cases. Because visually changed image in browser I cannot upload - at least I do not know of that option. And I also noticed when I destroy instance of Cropper, generated image data url via GetDataUrl "disposes" with it and if there is in html image node using that data it disappears with it too. Maybe it is just Mozilla problem, maybe of all browsers I did test that.

[fengyuanchen]

1. The rotation degree may be provided later.
2. The zoom level does not necessarily need to know, because all the data values was based on the original image, you can use them directly.
3. About "destroy": once you destroy a cropper instance, you can't get it back anymore. If you call any cropper method after then, you will create another cropper instance on the image.

[JadaVonRuth]

Thank you for your response.

2 zoom: so the zoom is working differently than I thought. Eg. when I would like to set a smaller image than crop area and want to zoom it to fit or oversize the crop rectangle is not a way how this plugin can be used.

2 destroy: I am running cropper as modal and after closing modal I want to display cropped result outside preview area. To prevent display problem when reopening modal after uploading another image I have to call destroy. To get image data I call getDataURL and set it to image outside cropper html area.

$modal.on("hidden.bs.modal", function () {
var dataURL = $image.cropper("getDataURL", "image/jpeg");
var dataResult = $("div#crop-result img");
dataResult .html('<img src="' + dataURL + '">');
$image.cropper("destroy");
});

If I need to preserve the result image in $("div#crop-result img") after calling Destroy func do I have clone the dataURL variable to prevent image disappear? dataURL seems to be objectively referenced to instance of cropper.

[KennedyTedesco]

@fengyuanchen The rotation degree is so useful for me. I'll wait for future commits. Tks!

[fengyuanchen]

@JadaVonRuth Once you get the base64 image by "getDataURL", you can destroy the cropper directly, and you can store the base64 image in anywhere you want.

[fengyuanchen]

The rotation degree can be got by "getImageData" method now.

[KennedyTedesco]

Amazing @fengyuanchen!

🍻