最近用到网页上传截图的方法
其实前端展示的实现非常简单
首先定义一个图片
<img src="test.jpg" style="width:100%;"/>
js调用
$("#board_image").Jcrop({
aspectRatio:2,
onChange:cutImage,
onSelect:cutImage,
allowMove:true,
allowSelect:false,
allowResize:true
},function(){
jcrop_api = this;
jcrop_api.animateTo([100,100,400,300]);
});
//截图
function cutImage(c){
<pre name="code" class="javascript"> //将坐标保存起来
$("#cut_image_size").val(c.x+","+c.y+","+c.w+","+c.h);
}
配置的具体参数可以到这里查看: Jcrop配置
这里主要展示java后台代码如何实现:
public void cut(){
//原图路径
String key = board_image.substring(board_image.lastIndexOf("/")+1);
String nm = Contants.IMAGE_PATH + "/" + key;
File file = new File(nm);
String upurl = "";
try {
InputStream in = new FileInputStream(file);
BufferedImage img = ImageIO.read(in);
//由于项目要在手机上显示,所以必须要做页面自适应,这里获取自适应后的图片显示的宽度
//将这里获取的宽度和原图的宽度进形对比获得比例
int wid = img.getWidth();
double ran = (double)drawsize / wid;
String ims[] = imgsize.split(",");
int x = Integer.parseInt(ims[0]);
int y = Integer.parseInt(ims[1]);
int w = Integer.parseInt(ims[2]);
int h = Integer.parseInt(ims[3]);
upurl = ImageUtils.cutAndScale("f", img,file,key,w,h,x,y,ran);
file.delete();
img.flush();
} catch (Exception e1) {
e1.printStackTrace();
}
}
/**
* 对图片进行剪切并压缩
* @param file
* @param newFileName
* @param width 图片宽度
* @param height 图片高度
* @param x x轴七点坐标
* @param y y轴七点坐标
*/
public static String cutAndScale(String ty,BufferedImage img,File file,String newFileName,int width, int height, int x, int y,double ran){
try {
int widthS = img.getWidth();
int heightS = img.getHeight();
Image image = img.getScaledInstance(widthS, heightS, Image.SCALE_SMOOTH);
x = (int)(x / ran);
y = (int)(y / ran);
width = (int)(width / ran);
height = (int)(height / ran);
ImageFilter filter = new CropImageFilter(x, y, width, height);
Image imgNew = Toolkit.getDefaultToolkit().createImage(new FilteredImageSource(image.getSource(), filter));
BufferedImage outimg = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB);
Graphics grap = outimg.getGraphics();
grap.drawImage(imgNew, 0, 0, null);
grap.dispose();
//我在这里又将截取后的图片进行了一次缩放,我所需要的图片大小为720x360
Image itemp = outimg.getScaledInstance(720, 360, Image.SCALE_SMOOTH);
double wr=720 * 1.0 / width;
double hr=360 * 1.0 / height;
AffineTransformOp ato = new AffineTransformOp(AffineTransform.getScaleInstance(wr, hr), null);
itemp = ato.filter(outimg, null);
makeDir(IMAGE_PATH + "/" + ty);
File newFile = new File(IMAGE_PATH + "/" + ty + "/" + newFileName);
ImageIO.write((BufferedImage)itemp, "jpg", newFile);
String rs = uploadToOSS(ty, newFileName, newFile);
newFile.delete();
return rs;
} catch (IOException e) {
e.printStackTrace();
}
return null;
}
终于OK了。