Handling EXIF Image Orientation

[bameyrick]

Firstly, thanks for the great plugin! However I've noticed a small issue; When loading an image in with EXIF orientation, everything works as expected until the "getDataURL" method is called. The generated image does not crop correctly and the rotation of the cropped image is incorrect.

Below I've provided screen shots of the chosen crop area and the image generated by "Get Data URL (JPG)". The image was taken on an iPad in portrait mode.

The white area in the generated image only seems to happen when a crop is taken near the bottom the image.

Thanks

[zilions]

After weeks of debugging, I have found that @bbrooks solution with the Javascript-Load-Image plugin is the best solution. It may be slightly slower (since it is converting to base64 along with reading meta data), yet it is basically bulletproof. Have tested it in many versions of iOS, Chrome and Firefox, and all the images that used to be rotated incorrectly, wrong aspect ratio and squished now work perfectly as expected. Thanks @bbrooks!

[ghybs]

Hi,

I am also facing this problem. I experienced the exact same symptoms as many other issues on the repo (90deg left-rotated image, inverted height-width aspect ratio / distortion, incorrect cropped area only once getting data URL, depending on options, external workaround tried, etc.)

In my case I develop an hybrid (Cordova-based) iOS app, so I use this plugin within a UIWebView (not Safari).

Therefore the IS_SAFARI browser sniffing test was not catching up the WebView behaving like on Safari. Adding an extra platform sniffing test (to detect iPhone / iPad / iPod) and OR'ing it with IS_SAFARI solved the issue for me.

[yelhouti]

Hi @ghybs can you say how you did the test for the UIWebView? I have the same problem with cordova

[kaynz]

@ghybs Could you create a pull request?

[ghybs]

Hi,

As for detecting the UIWebView, for now I just detect an iOS device: http://stackoverflow.com/questions/4460205/detect-ipad-iphone-webview-via-javascript

This is not bullet proof in the case of a Web App, as I guess people could still use another browser on an iOS device. Hopefully this already covers most cases.

I will try to make a PR when I have time.

[1fabiopereira]

I was having this problem, I did what @samrayner suggested and worked perfectly.

[GoToBoy]

fixed this using @bbrooks thanks

[faradoxuz]

var img0 = canvas.toDataURL(); // 5. get image @rern add mime type like canvas.toDataURL('image/jpeg'); in ortder not to have big size