Ionic 2 / Cordova picture rotate 90 deg - change exif

Question

Does anybody know how to rotate a pic in Ionic 2 app? (e.g. 90deg.) Probably exif info is needed to change?

I have saved img in applicationStorageDirectory like public base64Image: string; (e.g.: "data:image/png;base64,iVBORw0KGgoAAAA..."). I need to rotate it and then save.

Saving works fine, but I did not figure out how to rotate it. I tried JavaScript, canvas but it is not working. Also I can not find any useful Cordova plugin for this. Anybody knows how to figure it out?

Answer 1

You can look into this Javascript function to Rotate a base 64 image by X degrees and return new base64 . Or if you just want to see the image 90 degree turned, use simple css

transform: rotate(90deg).

Answer 2

If you are getting from the camera Camera.getPicture() accepts a parameter called "correctOrientation". If set to true, the resulting image will have the correct orientation instead of storing orientation in EXIF metadata. I just tried it on Android.

let options:CameraOptions  = {
  targetWidth: 500,
  targetHeight: 500,
  correctOrientation:true,
};

this.camera.getPicture(options).then((imageData) => {
  // imageData is either a base64 encoded string or a file URI

  // If it's base64:
  let base64Image = 'data:image/jpeg;base64,' + imageData;
}, (err) => {
  console.log("Error get camera picture:");
  console.log(err);
});