- 浏览: 550307 次
- 性别:
- 来自: 济南
文章分类
- 全部博客 (144)
- struts (1)
- 数据库 (13)
- Ext (4)
- mysql (10)
- PHP (2)
- informix (1)
- js (9)
- java (41)
- struts2 (9)
- wap (2)
- 浏览器 (2)
- hibernate (1)
- android (19)
- ibatis (2)
- css (1)
- 上传 html (1)
- kindeditor (1)
- sql service (2)
- spring (7)
- xml (1)
- oracle (1)
- log4j (2)
- 日期 (2)
- swing (5)
- jquery (4)
- eclipse (4)
- Maven (1)
- BUG (5)
最新评论
-
msdghs:
LZ你好,看了你的文章略有所获,但是里面的一些机制不是很明白, ...
spring quartz集群配置 -
linksky1018:
是我弄错啦,我忘了进行url解码了
java 汉字转Unicode -
linksky1018:
纯汉字转换还行
java 汉字转Unicode -
linksky1018:
貌似有问题吧
java 汉字转Unicode -
kizz:
谢谢您,帮了大忙
struts2 上传 验证图片大小 长宽
Jcrop 是一个功能强大的 jQuery 图像裁剪插件,结合后端程序可以快速的实现图片裁剪的功能。
1、先将图片上传至服务器,返回上传后的路径显示在客户端,上传成功后设置jcrop
2、本地裁剪,获得宽、高、x、y四个值,提交至服务器,由Java代码对图片流进行裁剪,本示例使用的是云存储,所以需要将原文件从云存储上获得流
官方详细示例:http://code.ciaoca.com/jquery/jcrop/
1、先将图片上传至服务器,返回上传后的路径显示在客户端,上传成功后设置jcrop
var c = {"x": 0, "y": 0, "x2": 295, "y2": 413, "w": 295, "h": 413}; $preview = $('#preview-pane'); $pcnt = $('#preview-pane .preview-container'); $pimg = $('#preview-pane .preview-container img'); xsize = $pcnt.width(); ysize = $pcnt.height(); $("#uploadIdentityImg").Jcrop({ bgColor: 'black', bgFade: true, bgOpacity: .4, aspectRatio: 0.71428571 / 1, minSize: [295, 413], maxSize: [590, 826], aspectRatio: xsize / ysize, setSelect: [c.x, c.y, c.x2, c.y2], //设定4个角的初始位置 onChange: currobj.showCoords, //当裁剪框变动时执行的函数 onSelect: currobj.showCoords //当选择完成时执行的函数 }, function () { // Use the API to get the real image size var bounds = this.getBounds(); boundx = bounds[0]; boundy = bounds[1]; // Store the API in the jcrop_api variable jcrop_api = this; $preview.appendTo(jcrop_api.ui.holder); }); showCoords: function (c) { if (parseInt(c.w) > 0) { var rx = xsize / c.w; var ry = ysize / c.h; imgH = parseInt(c.h); imgW = parseInt(c.w); imgX = parseInt(c.x); imgY = parseInt(c.y); $pimg.css({ width: Math.round(rx * boundx) + 'px', height: Math.round(ry * boundy) + 'px', marginLeft: '-' + Math.round(rx * c.x) + 'px', marginTop: '-' + Math.round(ry * c.y) + 'px' }); } }
2、本地裁剪,获得宽、高、x、y四个值,提交至服务器,由Java代码对图片流进行裁剪,本示例使用的是云存储,所以需要将原文件从云存储上获得流
@RequestMapping("jcripHeadImg") @ResponseBody public Map<String,Object> jcripHeadImg( @RequestParam(required=false,value="imgW",defaultValue="")int imgW, @RequestParam(required=false,value="imgH",defaultValue="")int imgH, @RequestParam(required=false,value="imgX",defaultValue="")int imgX, @RequestParam(required=false,value="imgY",defaultValue="")int imgY, @RequestParam(required=false,value="imgFileName",defaultValue="")String imgFileName){ //根据文件名 获得文件流 ImageInputStream iis = null; InputStream is=null; Map<String,Object> map=new HashMap<>(); map.put("status","n"); try { String type=imgFileName.substring(imgFileName.lastIndexOf(".")+1,imgFileName.length()); is= remoteFileService.downloadIS(imgFileName, type); Iterator<ImageReader> it = ImageIO.getImageReadersByFormatName(type); ImageReader reader = it.next(); // 获取图片流 iis = ImageIO.createImageInputStream(is); /* * <p>iis:读取源.true:只向前搜索 </p>.将它标记为 ‘只向前搜索’。 * 此设置意味着包含在输入源中的图像将只按顺序读取,可能允许 reader 避免缓存包含与以前已经读取的图像关联的数据的那些输入部分。 */ reader.setInput(iis, true); ImageReadParam param = reader.getDefaultReadParam(); /* * 图片裁剪区域。Rectangle 指定了坐标空间中的一个区域,通过 Rectangle 对象 * 的左上顶点的坐标(x,y)、宽度和高度可以定义这个区域。 */ Rectangle rect = new Rectangle(imgX, imgY, imgW, imgH); // 提供一个 BufferedImage,将其用作解码像素数据的目标。 param.setSourceRegion(rect); BufferedImage bi = reader.read(0, param); ImageOutputStream imOut =ImageIO.createImageOutputStream(bi); InputStream nIs =getImageStream(type,bi); String newFileName=remoteFileService.upload(nIs, imgFileName , type); map.put("status","y"); map.put("filename",newFileName); } catch (IOException e) { e.printStackTrace(); } return map; } /** * 将图片流文件转为inputstrame流 * @param type * @param bi * @return */ public InputStream getImageStream(String type,BufferedImage bi){ InputStream is = null; ByteArrayOutputStream bs = new ByteArrayOutputStream(); ImageOutputStream imOut; try { imOut = ImageIO.createImageOutputStream(bs); ImageIO.write(bi, type,imOut); is= new ByteArrayInputStream(bs.toByteArray()); } catch (IOException e) { e.printStackTrace(); } return is; }
官方详细示例:http://code.ciaoca.com/jquery/jcrop/
发表评论
-
不同版本的web.xml配置
2016-07-12 10:33 1037web.xml v2.3 <?xml version ... -
AutoComplete for jQuery
2015-04-10 13:33 487https://www.devbridge.com/sourc ... -
ajaxfileupload 提示文件另存为
2015-01-26 10:14 667使用Jquery 的插件AjaxFileUpload做上传时, ... -
jquery 根据表格行ID 获得数据
2015-01-14 10:53 2554var result=$("#listtab t ... -
java.lang.OutOfMemoryError: PermGen space
2014-12-12 15:24 693解决办法增大tomcat JVM内存设置 参数说明: -Xm ... -
struts2的iterator标签遍历HashMap
2014-11-17 10:56 732hashmap中保存的是string,object,objec ... -
java session统计在线人数
2014-11-17 09:00 948首先创建监听器,监听器实现ServletContextAttr ... -
Log4j写入数据库详解
2014-09-04 16:10 806log4j是一个优秀的开源日志记录项目,我们不仅可以对输出 ... -
将jar文件打包成exe安装文件(三)
2014-08-13 09:43 869通过前两篇 将jar文件打包成exe安装文件(一) ... -
将jar文件打包成exe安装文件(二)
2014-08-13 09:34 1041在上一篇中《将jar文件打包成exe安装文件(一)》介绍了,如 ... -
将jar文件打包成exe安装文件(一)
2014-08-13 09:26 1541将java项目打成exe可运 ... -
如何用java jdbc 向数据库表插入大数据量
2013-11-26 17:17 2002jvm:-Xmx1024m size = 1000000,可以 ... -
java获得当前时间一小时前的时间
2013-10-29 15:30 3430Calendar calendar = Calendar. ... -
log4j 日志输出至数据库
2013-10-28 11:19 19731、首先配置log4j ### set log leve ... -
使用Dom4j合并多个xml文件
2013-09-25 16:55 4893SAXReader saxReader = new SAX ... -
Java利用Ibatis的ScriptRunner解析sql
2013-09-11 13:28 5405需要导入mybatis-3.0.5.jar包 java直接解析 ... -
java 解析sql脚本
2013-08-29 14:27 1521java执行sql脚本,一种是解析sql脚本,生成每一条sql ... -
Spring 泛型 反射调用方法
2013-08-26 14:52 1629Object cz=springUtil.getBean( ... -
spring中使用ApplicationContext
2013-08-26 14:47 1001声明一个SpringUtil,并且实现ApplicationC ... -
Java中如何获得所有实现该接口的子类
2013-08-26 09:58 2873public static List<Class&g ...
相关推荐
jQuery图像裁剪插件Jcrop.js是一款功能强大的jQuery图像裁剪插件,可以结合后端程序快速的实现图片裁剪的功能。
<... <head> <meta charset="utf-8" />...jQuery图片裁剪插件Jcrop.js<... Jcrop.js实现的一款功能强大的jQuery图片裁剪插件,可以结合后端程序快速的实现图像裁剪的功能,右侧有3个图像缩略图尺寸可选。
移动端上传图片后,利用Jcrop进行图片任意尺寸的裁剪,适用于头像上传,商品图片上传等应用,配置简单
1.canvas上传图片base64-有裁剪功能-Jcrop.js ...3.4.可以设置是否-有裁剪图片大小条件,limitImg = true,可手动更改 可预览图片地址 https://blog.csdn.net/qq_29132907/article/details/82458365
Jcrop.js实现的一款功能强大的jQuery图片裁剪插件,可以结合后端程序快速的实现图像裁剪的功能,右侧有3个图像缩略图尺寸可选。
裁剪上传图片 jcrop
jcrop图片裁剪demo,简单的jcrop图片裁剪demo,下载后可以直接用
图片裁剪插件JqueryJcrop兼容大数浏览器,测试无误,链接了中文参数说明详情见页面
jquery-Jcrop实现图片裁剪截图上传和保存。
可以实现头像等的按比例裁剪。也可以按照需求自由裁剪。插件基于jQuery,方便好用。内含使用demo,可参照demo快速上手。
Jcrop图片预览裁剪功能,兼容IE8及IE8+和主流浏览器,预览框高度不限制,如需要限制高度需自行改写,也可留言联系。
Jcrop插件,进行图片选取,后台java对图片进行裁剪
PHP+jQuery+jCrop裁剪头像 处理图片
js 的 jCrop 插件 配合 php 进行图片剪切以及上传!
Jcrop 图片裁剪 jcrop-v0.9.10
做Jcrop图片裁剪的必须文件
ASP.NET 实现的用uploadify(uploadify-v2.1.4)上传图片,然后用jcrop裁剪需要的区域,然后上传到服务器中。 完整DEMO,放心下载。 浏览器兼容性没怎么测试,在chrome下没问题
Jcrop (官方的) - 图片裁剪jQuery插件
使用jquery+Jcrop+servlet,简单实现图片上传默认裁剪,选择裁剪区域不同尺寸进行预览,并进行裁剪图片保存,获取裁剪后的图片显示。