jQuery+PHP实现上传裁剪图片

2020-05-17 06:23:50易采站长站整理

}
} else if (window.webkitURL!=undefined) { // webkit or chrome
for(var i=0;i<file.length;i++)
{
url[i] = window.webkitURL.createObjectURL(file[i]) ;
}
}
return url ;
}

html代码(这些代码要放在同一级)


<!-- 文件上传标签,添加class属性CutImage -->
<input class="CutImage" type="file" name="img" />

<!-- 传送图片裁剪比例等参数,要添加class属性imgCoord,ratio为裁剪后要保存的宽高width*height -->
<input ratio="100*100" type="hidden" class="imgCoord" name="imgCoord">

<!-- 图片预览,要添加class属性showImgDiv,showImgWidth表示预览时的宽度 -->
<div showImgWidth="100" class="showImgDiv"></div>

php代码


/*图片上传代码略 下面直接进行图片裁剪*/

/**
* [cut_img 图片裁剪函数] * Author: 程威明
* @param array $imgs 图片路径数组
* @param array $info 裁剪信息數組,包括裁剪后要保存的宽高、图片大小与裁剪开始坐标之比
* @param bool $cover 是否覆盖原图,默认不覆盖
* @return array 若覆盖原图返回裁剪数量,不覆盖返回图片路径组成的数组
*/
function cut_img($imgs=array(),$infoarr=null,$cover=false)
{
if($infoarr==null) return $imgs;

//判断是否为数组(必须是一个以图片路径组成的数组)
$imgs = is_array($imgs)?$imgs:array($imgs);

//把多个裁剪信息切成单个信息组成的数组
$infoarr = explode(',', $infoarr);

$save_file = array();

$i=0;
foreach($imgs as $file){

//如果不覆盖原图,可重新定义图片保存路径
if(false==$cover){
$file = $file;
}

//把裁剪信息切割成数组,第一个为要保存的宽第二个为要保存的高,第三和第四个为图片宽高与裁剪起点的比例
$info = explode('#', $infoarr[$i]);

//裁剪宽高比
$ratio = $info[0]/$info[1];

//判断图片是否存在
if(!file_exists($file)) continue;

//获取图片信息
$imgize = getimagesize($file);

//图片宽度
$width = $imgize[0];
//图片高度
$height = $imgize[1];

//图片裁剪起点坐标
$x = $info[2]==0?0:$imgize[0]/$info[2];
$y = $info[3]==0?0:$imgize[1]/$info[3];

//判断图片原宽高比与裁剪宽高比的大小
if($width/$height>=$ratio){
$width = $height*$ratio;//如大于即为裁剪宽度
}else{
$height = $width/$ratio;//如小于即为裁剪高度
}

//裁剪的寬高不能超出圖片大小
if(($width+$x)>$imgize[0]){