PhoneGapイメージ変換後の問題

Question

私たちは開発中のコア機能のうち、ユーザープロファイルセクションを備えたPhoneGapアプリケーションを開発しています。その画面/セクション内で、ユーザーはプロフィール画像を含む様々な詳細を更新することができます。プロファイル画像は、カメラ（完全に機能する）で撮影するか、ユーザーフォトライブラリから選択することができます。ここに私たちの問題があります。

navigator.camera.getPicture機能を使用して、ユーザーのカメラまたはカメラのロールから写真をロードしています。

新しいImage()を作成し、電話ギャップで返されたimageURIを画像srcとして設定します。イメージのonload関数では、イメージをキャンバスコンテキストに描画してサイズを変更し、四角形にします。

に

（HTML5 Canvas drawImage ratio bug iOS）問題を私たちは、画像をレンダリングする際に押しつぶされた画像に問題があったが、我々はこの記事の助けを借りて、その問題を修正しました：私たちが得るときすべてがうまく機能カメラからの直接の画像ですが、 destinationTypeを navigator.camera.PictureSourceType.SAVEDPHOTOALBUMまたは navigator.camera.PictureSourceType.PHOTOLIBRARYに設定すると、画像が正しく回転しません。

correctOrientationは、がtrueに設定されています。

我々はdesignationTypeはCAMERAとPHOTOLIBRARYためNATIVE_URIためFILE_URIあるとき私たちは、画像データのみを取得することができコルドバ2.8

を使用しています。この違いは私たちの問題と関係がありますか？

コードは次のとおりです。

navigator.camera.getPicture(function (imageURI) { 

context = // 2d context from canvas object in the DOM 

base_image = new Image(); 
base_image.onload = function() { 

var x = 0; 
var y = 0; 
var w = 144; 
var h = 144; 

... // some size and offset calculations 
var ratio = ... // calculate a ratio based off this question https://stackoverflow.com/questions/11929099/html5-canvas-drawimage-ratio-bug-ios 

context.drawImage(base_image, x, y, base_image.width, base_image.height, 0, 0, w, h/ratio); 

url = context.canvas.toDataURL().toString(); 

DOMImage.src = url 
} 

base_image.src = imageURI; 

}, function (error) { 
enyo.log("Error " + error); 

}, { 
    quality : 49, 
    targetWidth: 114, 
    targetHeight: 114, 
    sourceType: sourceType, 
    encodingType: Camera.EncodingType.JPEG, 
    destinationType: destinationType, 
    correctOrientation: true, 
    saveToPhotoAlbum: false 
}); 

何かアドバイスははるかに高く評価されます。

Answer 1

画像の向きはEXIFデータに保存されます。 Hereあなたの問題の解決策を見つけることができます。