转换后的PhoneGap图像旋转问题

我们正在开发一个PhoneGap应用程序，它正在开发的核心功能中还包含一个用户配置文件部分。在该屏幕/部分中，我们允许用户更新各种详细信息，包括他们的个人资料图像。配置文件图像可以使用相机拍摄（完美运行）或从用户照片库中选择。这是我们的问题所在。转换后的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。

我们使用科尔多瓦2.8

我们只能得到图像数据时的designationType为FILE_URI摄像头和NATIVE_URI为PHOTOLIBRARY。这种差异可能与我们的问题有关吗？

的代码是：

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 
});

任何意见是非常赞赏。

来源

2013-09-25 Chris Owens

你知道吗？我正面临同样的问题，科尔多瓦2.9 –

图像方向存储在EXIF数据中。 Here你可以找到解决你的问题。

来源

2014-11-13 12:05:21

转换后的PhoneGap图像旋转问题

回答

相关问题