ในโครงการเราต้องทำการอัปโหลดอวตาร, ฟังก์ชั่นการตัดรูปภาพ, ตกลงอ่านบทความต่อไปนี้!
ฉันต้องการปลั๊ก -in: jQuery jCrop
Back -end Code:
org.csg.upload; .mageio.imageio; Param Path2 เส้นทางที่เก็บไว้หลังจากการตัด* @param XX เพลา* @param yy เพลา* @param w* @param h*/ โมฆะคงที่สาธารณะ cutimage (String Path1, String Path2, int x, int y, int w, int h) {FileInputStream FileInputStream = NULL; "jpg"); imageReader reader = it.next (); ).; ("การตัดล้มเหลว");} ในที่สุด {ลอง (ไฟล์อินพุตสตรีม! = null) {fileInputStream.close ();} ถ้า (คือ! = null) {iis.close ();}} catch (ioexcetion e) {e PrintStackTrace ();}}}}}}}}}}}}}}}}
รหัสการเข้าถึง:
<%@page language = "java" import = "java.util.*, org.csg.upload.*" pageencoding = "utf-8"%> <%// สายสัมพันธ์สัมพัทธ์ ER (ER "IMGPath") ; เซิร์ฟเวอร์หลังจากการตัดสตริง path2 = relpath+"/images/"+newfilename; Integer.ParseInt (request.getParameter ("W"); int h = integer.parseint (request.getParameter ("H"); ลอง {upload.c.c Utimage (path1, path2, x, y, w, h); .print ("<img src = 'images/"+newfilename+"'/>");} catch (exception e) {e.printstacktrace ();
รหัส JSP:
<%@ page language = "java" image = "java.util.*" pageencoding = "utf-8"%> <! JSP พัฒนา Avatar Cutting </title> <meta http-equiv = "pragma" content = "no-cache"> <meta http-equiv = "cache-control" content = "no-cache"> <meta http-equiv = " "Expires" content = "0"> <meta http-equiv = "คำหลัก" content = "คำหลัก 1, คำหลัก 2, คำหลัก 3"> <meta http-equiv = "คำอธิบาย ption" content = "นี่คือหน้าของฉัน"> <ลิงค์ rel = "stylesheet" href = "css/jQuery.jcrop.css" type = "text/css"/> <script type = "text/javascript" src = "js/jquery.min.js"> </script> <script type = "text/javascript" src = "js/jQuery.jcrop.min.js"> </script> <alle type = "text/css"> *{margin: 0; {margen-top: 20px;} #preview-pane {display: block; 0, .4) ของแข็ง; )--moz-box-shadow: 1px 1px 5px 2px rgba (0, 0, 0, 0.2); } </style> <script type = "text/javascript"> nction () {var jcrop_api, boundx = "", boundy = "", $ preview = $ ('#preview-pane'), $ pcnt = $ ( '#preview-pane .preview-container'), $ pimg = $ ('#preview-pane .preview-controlainer img'), xsize = $ pcnt.width (), ysize = $ pcnt.head (); '#Cutimage') (jCrop_api.ui.holder);}); $ ("#y1") ; math.round (rx * cx) + 'px', margintop: ' + math.round (ry * cy) +' px '});}}}); > การพัฒนา Java QQ Avatar ระบบการตัด </h1> <img id = "cutimage" src = "images/1.jpg"> <div id = "preview-pane"> <div> <img src = "ภาพ/1 jpg "/> </div> </div> </div> <form action =" success.jsp "method =" post "> <input type =" text "value =" images/1.jpg "name =" imgPath "> x axis: <อินพุต type =" text "size =" 4 "id =" x1 "name =" x " /> y axis: <อินพุต type =" text "size =" 4 "id =" y1 " name = "y"/> width: <อินพุต type = "text" size = "4" id = "w" name = "w"/> ความสูง: <อินพุต type = "text" size = "4" id = " h "name =" h "/> <อินพุต type =" submit "value =" cut "/> </form> </body> </html>
แผนที่เอฟเฟกต์:
ข้างต้นเป็นเนื้อหาทั้งหมดของบทความนี้