方案一
/**
* 旋转照片
* @param dom 要旋转的dom元素
*/
function rotate(dom){
var ele =$(dom);
var css = ele.css('transform');
var deg;
var step=90;//每次旋转多少度
if(css ==='none'){
deg =0;
}else {
deg=eval('get'+css);
}
ele.css({'transform':'rotate('+(deg+step)%360+'deg)'});
}
function getmatrix(a,b,c,d,e,f){
var aa=Math.round(180*Math.asin(a)/ Math.PI);
var bb=Math.round(180*Math.acos(b)/ Math.PI);
var cc=Math.round(180*Math.asin(c)/ Math.PI);
var dd=Math.round(180*Math.acos(d)/ Math.PI);
var deg=0;
if(aa===bb||-aa===bb){
deg=dd;
}else if(-aa+bb===180){
deg=180+cc;
}else if(aa+bb===180){
deg=360-cc||360-dd;
}
return deg>=360?0:deg;
}
方案二
/**
* 旋转照片方向
* @param {Object} dir 照片方向
*/
function getImgData(dir) {
var image =new Image();
image.onload =function () {
var degree =0, drawWidth, drawHeight, width, height;
drawWidth =this.naturalWidth;
drawHeight =this.naturalHeight;
var canvas =document.createElement('canvas');
canvas.width = width = drawWidth;
canvas.height = height = drawHeight;
var context = canvas.getContext('2d');
//判断图片方向,重置canvas大小,确定旋转角度,iphone默认的是home键在右方的横屏拍摄方式
switch (dir) {
//iphone横屏拍摄,此时home键在左侧
case 3:
degree =180;
drawWidth = -width;
drawHeight = -height;
break;
//iphone竖屏拍摄,此时home键在下方(正常拿手机的方向)
case 6:
canvas.width = height;
canvas.height = width;
degree =90;
drawWidth = width;
drawHeight = -height;
break;
//iphone竖屏拍摄,此时home键在上方
case 8:
canvas.width = height;
canvas.height = width;
degree =270;
drawWidth = -width;
drawHeight = height;
break;
}
//使用canvas旋转校正
context.rotate(degree * Math.PI /180);
context.drawImage(this, 0, 0, drawWidth, drawHeight);
//返回校正图片
return canvas.toDataURL("image/jpeg", 1);
}
}