Javascript Cordova如何从相机旋转图片
我用cordova相机插件拍照 camera.getPicture()api 获取一个base64图像如何将这个base64图像向右旋转90,并获取要保存的新base64字符串 我的代码:Javascript Cordova如何从相机旋转图片,javascript,android,ios,cordova,ionic,Javascript,Android,Ios,Cordova,Ionic,我用cordova相机插件拍照 camera.getPicture()api 获取一个base64图像如何将这个base64图像向右旋转90,并获取要保存的新base64字符串 我的代码: Camera.getPicture(options).then(function(imageURI) { var img = new Image(); img.src = "data:image/png;base64," + imageURI; var rot
Camera.getPicture(options).then(function(imageURI) {
var img = new Image();
img.src = "data:image/png;base64," + imageURI;
var rotate = false;
if (img.width > img.height) {
rotate = true;
}
uploadImage(imageURI, activeIndex, rotate);
}, function(err) {
console.log(err);
$ionicLoading.hide();
});
函数来旋转图片
var rotateImage = function (base64ImageSrc) {
var canvas = document.createElement('canvas');
var img = new Image();
img.src = base64ImageSrc;
var context = canvas.getContext('2d');
// translate context to center of canvas
context.translate(canvas.width / 2, canvas.height / 2);
// rotate 45 degrees clockwise
context.rotate(Math.PI / 4);
console.log(canvas.toDataURL());
var ImageUrl = canvas.toDataURL();
ImageUrl = ImageUrl.split("data:image/png;base64,");
ImageUrl = ImageUrl[1];
console.log(ImageUrl);
return ImageUrl;
};
使用画布可以实现图像旋转
function rotateBase64Image() {
var canvas = document.createElement('canvas');
var ctx = canvas.getContext("2d");
var image = new Image();
image.src = base64data;
image.onload = function() {
ctx.translate(image.width, image.height);
ctx.rotate(180 * Math.PI / 180);
ctx.drawImage(image, 0, 0);
window.eval(""+callback+"('"+canvas.toDataURL()+"')");
};
}
base64数据:包含base64编码照片图像[原始图像]的字符串
canvas.toDataURL():旋转图像
它的返回图像base64字符串非常短,因此看起来很正常