# Cordova Camera Plugin allowEdit cropping not working after taking picture

**URL:** <https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713>\
**Category:** uncategorized\
**Created:** [September 18, 2015, 1:32pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713 "2015-09-18T13:32:31Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [September 18, 2015, 1:32pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/1 "2015-09-18T13:32:32Z")

</div>

I’ve got two pretty typical options, take picture and choose picture.

I’m trying to crop to a square image in iOS.

This works well when choosing a picture from the camera roll.

However, after taking a picture with the camera, I can not move the image up and down to crop. I can zoom in and out, but can not adjust up and down.

```
$scope.takePicture = function() {
  console.log("Getting camera...");
  Camera.getPicture({
    allowEdit : true,
    targetWidth: 300,
    targetHeight: 300
  }).then(function(imageURI) {
    $scope.imageURI = imageURI;
    console.log(imageURI);
  }, function(err) {
    console.log(err);
  });
};

$scope.choosePicture = function() {
 console.log("Getting camera...");
 Camera.getPicture({
   allowEdit : true,
   targetWidth: 300,
   targetHeight: 300,
   sourceType : 0
 }).then(function(imageURI) {
   $scope.imageURI = imageURI;
   console.log(imageURI);
 }, function(err) {
   console.log(err);
 });
};
```

---

<div class="post-metadata">

**Author:** ![vaibhavn1](https://avatars.discourse-cdn.com/v4/letter/v/c4cdca/32.png) [@vaibhavn1](https://forum.ionicframework.com/u/vaibhavn1)\
**Post date:** [October 14, 2015, 10:06am UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/2 "2015-10-14T10:06:01Z")

</div>

Hi mate,

Even i was facing this issue …

remove the current camera plugin by running this command

> ```
> cordova plugin rm cordova-plugin-camera
> 
> ```

Then install this old version of the plugin.

> cordova plugin add cordova-plugin-camera@0.3.6

It should work after this.

Let me know if it works…

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 1:25pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/3 "2015-10-14T13:25:34Z")

</div>

No luck. I’m still seeing the same cropping issue.

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 1:53pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/4 "2015-10-14T13:53:30Z")

</div>

Here’s a comparison. The one that’s broken is from taking a picture. The one that works is from choosing a picture.

![image](https://global.discourse-cdn.com/ionicframework/original/3X/3/2/3232cfe262a117a5b974e97244bf40499f8ad2c5.gif)

---

<div class="post-metadata">

**Author:** ![leob](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/leob/32/14245_2.png) [@leob](https://forum.ionicframework.com/u/leob)\
**Post date:** [October 14, 2015, 2:03pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/5 "2015-10-14T14:03:15Z")

</div>

If you want really good image cropping then I can recommend this Angular directive:

[https://github.com/alexk111/ngImgCrop](https://github.com/alexk111/ngImgCrop)

That works for any image no matter the source where you got it from.

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 2:06pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/6 "2015-10-14T14:06:02Z")

</div>

I’ve tried ngImgCrop, which was ok, but it doesn’t support high resolution displays, like the iPhone. It looks bad / pixelated. I ask had issues getting an image to store locally after crop for use in uploading. But I’ve had that issue with every canvas based cropping directive.

---

<div class="post-metadata">

**Author:** ![leob](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/leob/32/14245_2.png) [@leob](https://forum.ionicframework.com/u/leob)\
**Post date:** [October 14, 2015, 2:09pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/7 "2015-10-14T14:09:49Z")

</div>

Okay I see, thanks for the info.

Well actually I don’t even want the images in my app to be that hi-res, because I’m retrieving them over the network. So I want them to be fairly small (tens or hundreds of KB’s, not MB’s).

So, I’m setting the JPEG quality fairly low already (even before I feed them into ngImgCrop).

Didn’t run into issues of unacceptable quality as yet.

---

<div class="post-metadata">

**Author:** ![vaibhavn1](https://avatars.discourse-cdn.com/v4/letter/v/c4cdca/32.png) [@vaibhavn1](https://forum.ionicframework.com/u/vaibhavn1)\
**Post date:** [October 14, 2015, 2:26pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/8 "2015-10-14T14:26:46Z")

</div>

Try using this plugin to crop. I tried for Android. Worked very well.

> **[jeduan/cordova-plugin-crop](https://github.com/jeduan/cordova-plugin-crop/)**
>
> cordova-plugin-crop - Crop an image in Cordova

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 2:28pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/9 "2015-10-14T14:28:57Z")

</div>

The image quality is actually fine. It’s the interface that’s the issue. I submitted the issue on their github:

> <https://github.com/alexk111/ngImgCrop/issues/94>

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 2:30pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/10 "2015-10-14T14:30:30Z")

</div>

I’ve also tried implementation of cordoba-plugin-crop, which I liked, but the server is setup to take actual images, and not base64. I wasn’t able to get the base64 back to an image before uploading.

---

<div class="post-metadata">

**Author:** ![anon39735932](https://avatars.discourse-cdn.com/v4/letter/a/8c91f0/32.png) [@anon39735932](https://forum.ionicframework.com/u/anon39735932)\
**Post date:** [October 14, 2015, 2:31pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/11 "2015-10-14T14:31:48Z")

</div>

It would be great if this just worked. Or at least their was a work around that didn’t require supporting a whole other plugin.

---

<div class="post-metadata">

**Author:** ![leob](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/leob/32/14245_2.png) [@leob](https://forum.ionicframework.com/u/leob)\
**Post date:** [October 14, 2015, 2:49pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/12 "2015-10-14T14:49:57Z")

</div>

Okay understood, thanks for the heads-up.

For now I’ll make do with this plugin (the project’s already taking too long anyway, and maybe I’ll not even release it on iOS), but I’ll keep eye on the issue, maybe they’ll supply a fix.

By the way, I’m using a fork of ngImgCrop:

[https://github.com/iblank/ngImgCrop](https://github.com/iblank/ngImgCrop)

The difference is that the fork allows rectangular (non-square) crop areas, something which I believe the Cordova camera plugin doesn’t even allow.

---

<div class="post-metadata">

**Author:** ![outfitpic](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/outfitpic/32/99860_2.png) [@outfitpic](https://forum.ionicframework.com/u/outfitpic)\
**Post date:** [November 23, 2015, 2:36pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/13 "2015-11-23T14:36:56Z")

</div>

Did you ever find a solution to this?

---

<div class="post-metadata">

**Author:** ![texasman03](https://avatars.discourse-cdn.com/v4/letter/t/eb9ed0/32.png) [@texasman03](https://forum.ionicframework.com/u/texasman03)\
**Post date:** [May 26, 2016, 6:22am UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/14 "2016-05-26T06:22:44Z")

</div>

+1

Same issue, I can’t crop on IOS9+

The image always snaps back into place

---

<div class="post-metadata">

**Author:** ![haytam](https://avatars.discourse-cdn.com/v4/letter/h/9fc348/32.png) [@haytam](https://forum.ionicframework.com/u/haytam)\
**Post date:** [August 31, 2016, 1:29pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/15 "2016-08-31T13:29:36Z")

</div>

Same issue, is there a working solution ?

---

<div class="post-metadata">

**Author:** ![Amila86](https://avatars.discourse-cdn.com/v4/letter/a/7ab992/32.png) [@Amila86](https://forum.ionicframework.com/u/Amila86)\
**Post date:** [September 7, 2016, 9:27am UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/16 "2016-09-07T09:27:26Z")

</div>

You may try

> **[Crop-it-and-share](https://market.ionicframework.com/plugins/crop-it-and-share)**
>
> Crop Image and Share It

---

<div class="post-metadata">

**Author:** ![mcihak](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mcihak/32/104211_2.png) [@mcihak](https://forum.ionicframework.com/u/mcihak)\
**Post date:** [May 2, 2017, 7:06am UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/17 "2017-05-02T07:06:55Z")

</div>

Any news with default crop? On iOS 10 still not working (after move image jumps back do default position.)

---

<div class="post-metadata">

**Author:** ![malina-kirn](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/malina-kirn/32/112843_2.png) [@malina-kirn](https://forum.ionicframework.com/u/malina-kirn)\
**Post date:** [November 1, 2017, 7:42pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/18 "2017-11-01T19:42:49Z")

</div>

It’s likely due to native cropping capabilities in the iOS camera app. Reading up on [this feature request](https://issues.apache.org/jira/browse/CB-7668) for android, the `cordova-camera-plugin` delegates to the application for cropping. Not sure what it does for iOS, but it appears the plugin doesn’t implement pan and crop itself. If you read the [README](https://github.com/apache/cordova-plugin-camera), you’ll see that the canEdit setting is ignored on most platforms. Likely not a good idea to use it unless you only need to support iOS – and are OK with an inconsistent UX between the camera and photo library.

I ended up implementing my own image zoom and pan on a canvas with mouse and touch support. [Snippet is here](https://bitbucket.org/snippets/MalinaKirn/74ggK5), feel free to borrow the code. My implementation won’t force the image to stay within the canvas, however, double-tap/click will reset the image. My implementation does not allow image rotation, which some of the android croppers do allow. Hammer does provide a rotate event, so rotation could be added, if desired.

---

<div class="post-metadata">

**Author:** ![bhambanip](https://avatars.discourse-cdn.com/v4/letter/b/c77e96/32.png) [@bhambanip](https://forum.ionicframework.com/u/bhambanip)\
**Post date:** [June 5, 2018, 4:57pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/19 "2018-06-05T16:57:12Z")

</div>

Any Info on this. Want something to crop images in IOS

---

<div class="post-metadata">

**Author:** ![mcihak](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mcihak/32/104211_2.png) [@mcihak](https://forum.ionicframework.com/u/mcihak)\
**Post date:** [October 23, 2018, 1:46pm UTC](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713/20 "2018-10-23T13:46:04Z")

</div>

Any news on this? I have latest version of ion and camera plugin and cropping after taking photo is not possible to change. If I choose from gallery, everything works…

[Next page](https://forum.ionicframework.com/t/cordova-camera-plugin-allowedit-cropping-not-working-after-taking-picture/32713.md?page=2)
