# Camera image resize/compression **URL:** \ **Category:** ionic-v1\ **Created:** [November 29, 2014, 7:38pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387 "2014-11-29T19:38:41Z")\ **Posts on this page:** 15\ **Page:** 1
**Author:** ![mramey](https://avatars.discourse-cdn.com/v4/letter/m/50afbb/32.png) [@mramey](https://forum.ionicframework.com/u/mramey)\ **Post date:** [November 29, 2014, 7:38pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/1 "2014-11-29T19:38:41Z")
Hi, I need to figure out how to compress/resize an image that I capture from then cordova-camera plugin. Right now the images are 4.7mb, and 2448 × 3264 in size. This is nowhere near compatible for uploading or usable in my application. Here is the code I use to take the picture, I dont actually see a size option, I see quality which I have set to 50. Is there a size option? My ideal configuration would be like instagrams. Im not sure how to get something like that, as the camera takes a pic using the full screen. ``` $scope.takePicture = function() { // ****S3. Check**** //alert("got camera button click"); var options = { quality: 50, destinationType: destinationType, sourceType: pictureSource, encodingType: 0 }; if (!navigator.camera) { // ****S4. Check**** //alert("S4. Lost Camera"); // error handling return; } navigator.camera.getPicture( function (imageURI) { // ****S5. Check**** //alert("S5. got picture success ", imageURI); $scope.mypicture = imageURI; // ****S5. Check**** //alert($scope.mypicture); }, function (err) { // ****S5. Check**** //alert("S5. got no picture error ", err); // error handling camera plugin }, options); }; ``` ---
**Author:** ![AntonV](https://avatars.discourse-cdn.com/v4/letter/a/7bcc69/32.png) [@AntonV](https://forum.ionicframework.com/u/AntonV)\ **Post date:** [December 1, 2014, 5:11am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/2 "2014-12-01T05:11:51Z")
Use these options from the Cordova plugin: - **targetWidth** : Width in pixels to scale image. Must be used with targetHeight. Aspect ratio is maintained. (Number) - **targetHeight** : Height in pixels to scale image. Must be used with targetWidth. Aspect ratio is maintained. (Number) [Camera Options](http://docs.phonegap.com/en/2.4.0/cordova_camera_camera.md.html#cameraOptions) ---
**Author:** ![mramey](https://avatars.discourse-cdn.com/v4/letter/m/50afbb/32.png) [@mramey](https://forum.ionicframework.com/u/mramey)\ **Post date:** [December 1, 2014, 9:03pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/3 "2014-12-01T21:03:54Z")
Hey thanks, I found out shortly after posting. Works Great! ---
**Author:** ![kov\_lxrumba47](https://avatars.discourse-cdn.com/v4/letter/k/a183cd/32.png) [@kov\_lxrumba47](https://forum.ionicframework.com/u/kov_lxrumba47)\ **Post date:** [November 24, 2015, 7:36am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/4 "2015-11-24T07:36:13Z")
after cropping, original image is coming instead of the cropped image. Are you having the same problem in android?? ---
**Author:** ![Mishra\_ji](https://avatars.discourse-cdn.com/v4/letter/m/34f0e0/32.png) [@Mishra\_ji](https://forum.ionicframework.com/u/Mishra_ji)\ **Post date:** [July 29, 2016, 9:12am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/6 "2016-07-29T09:12:58Z")
May i know what you had done in this code to get the result? ---
**Author:** ![avrajyoti](https://avatars.discourse-cdn.com/v4/letter/a/e68b1a/32.png) [@avrajyoti](https://forum.ionicframework.com/u/avrajyoti)\ **Post date:** [October 20, 2016, 3:45pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/7 "2016-10-20T15:45:20Z")
I am also trying to resize and compress the image before uploading. Trying with the below camera option. imageUpload(){ ``` Camera.getPicture({ destinationType: Camera.DestinationType.DATA_URL, sourceType : Camera.PictureSourceType.PHOTOLIBRARY, targetWidth: 100, targetHeight: 100 }).then((imageData: any) => { // imageData is a base64 encoded string this.base64Image = "data:image/jpeg;base64," + imageData; }, (err) => { console.log(err); }); } ``` But with that the quality becomes poor while display. Any solution without much of a compromise in quality. ---
**Author:** ![onymos](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/onymos/32/94813_2.png) [@onymos](https://forum.ionicframework.com/u/onymos)\ **Post date:** [February 28, 2017, 10:56pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/8 "2017-02-28T22:56:57Z")
**AD:** Try [Onymos Media Component](https://www.onymos.com/products/media) to handle your media resize/compression needs. Check out our cool hands-on [demo](https://www.onymos.com/blog) of the World’s 1st variable compression of Photos and Videos on iOS and Android. ---
**Author:** ![arpitgoyal138](https://avatars.discourse-cdn.com/v4/letter/a/c57346/32.png) [@arpitgoyal138](https://forum.ionicframework.com/u/arpitgoyal138)\ **Post date:** [March 6, 2017, 9:47am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/9 "2017-03-06T09:47:51Z")
Thanks It is working. You can have 500 by 500 ---
**Author:** ![umeshionic1234](https://avatars.discourse-cdn.com/v4/letter/u/c37758/32.png) [@umeshionic1234](https://forum.ionicframework.com/u/umeshionic1234)\ **Post date:** [March 4, 2018, 8:17am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/10 "2018-03-04T08:17:33Z")
am taking image through camera and display that image on canvas…when am adding targetwidth and target height option in my camera option…it does not effect on image …any solution ??? ---
**Author:** ![Bhavsang](https://avatars.discourse-cdn.com/v4/letter/b/c4cdca/32.png) [@Bhavsang](https://forum.ionicframework.com/u/Bhavsang)\ **Post date:** [March 17, 2018, 1:19pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/11 "2018-03-17T13:19:27Z")
Hi Umesh, If you want to use camera image resize or compression just try once quality and set whatever quality of image you want. See below example that i used in my app and its working perfect. I hope it will help you and others also. Camera.getPicture({ destinationType: Camera.DestinationType.DATA\_URL, quality:5, correctOrientation: true }). Thank You ---
**Author:** ![umeshionic1234](https://avatars.discourse-cdn.com/v4/letter/u/c37758/32.png) [@umeshionic1234](https://forum.ionicframework.com/u/umeshionic1234)\ **Post date:** [March 17, 2018, 1:33pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/12 "2018-03-17T13:33:36Z")
yes thank you …but when am setting targetwidth and targetheight it does not gave me that size image ---
**Author:** ![Bhavsang](https://avatars.discourse-cdn.com/v4/letter/b/c4cdca/32.png) [@Bhavsang](https://forum.ionicframework.com/u/Bhavsang)\ **Post date:** [March 17, 2018, 1:57pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/13 "2018-03-17T13:57:43Z")
Can you please check once this code and let me know if its useful or else share your code. Camera.getPicture({ destinationType: Camera.DestinationType.DATA\_URL, targetWidth: 320, targetHeight: 320, correctOrientation: true }).then((data) =\> { this.model.imageString = data; [//this.model.imageString1](https://this.model.imageString1) = “data:image/jpeg;base64,” + data; this.isHideBox = 1; let options = { message: “Image uploaded”, duration: 2500, cssClass: “toast.scss”, position: ‘middle’ }; this.\_tc.create(options).present(); ``` }, (error) => { alert(error); }); ``` ---
**Author:** ![umeshionic1234](https://avatars.discourse-cdn.com/v4/letter/u/c37758/32.png) [@umeshionic1234](https://forum.ionicframework.com/u/umeshionic1234)\ **Post date:** [March 17, 2018, 2:00pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/14 "2018-03-17T14:00:17Z")
okay thanks i will try this …can you please give me your email id ?? ---
**Author:** ![Bhavsang](https://avatars.discourse-cdn.com/v4/letter/b/c4cdca/32.png) [@Bhavsang](https://forum.ionicframework.com/u/Bhavsang)\ **Post date:** [March 17, 2018, 2:01pm UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/15 "2018-03-17T14:01:50Z")
[bhavsang@itoneclick.com](mailto:bhavsang@itoneclick.com) ---
**Author:** ![Priyanka4010](https://avatars.discourse-cdn.com/v4/letter/p/74df32/32.png) [@Priyanka4010](https://forum.ionicframework.com/u/Priyanka4010)\ **Post date:** [August 22, 2018, 4:49am UTC](https://forum.ionicframework.com/t/camera-image-resize-compression/13387/16 "2018-08-22T04:49:23Z")
hi , if we give targetwidth and targetHeight to the image , it will not show up according to given width and height , not with the original size of the image. please help me to retain the original size of image and quality with reducing the size .