上传图片回显,头像截取 SWFload areaSelect插件
1 @{ 2 ViewBag.Title = "Index"; 3 Layout = "~/Views/Shared/_LayoutPage.cshtml"; 4 } 5 6 @section head{ 7 8 <script src="~/Content/SWFUpload/swfupload.js"></script> 9 <script src="~/Content/SWFUpload/handlers.js"></script> 10 <link href="~/Content/CSS/imgareaselect-default.css" rel="stylesheet" /> 11 <script src="~/Scripts/jquery.imgareaselect.min.js"></script> 12 <script type="text/javascript"> 13 var swfu; 14 window.onload = function () { 15 swfu = new SWFUpload({ 16 // Backend Settings 17 upload_url: "/UserInfoManager/Upload", 18 post_params: { 19 "ASPSESSID": "@{ 20 try 21 { 22 @Session.SessionID; 23 } 24 catch 25 { 26 27 } 28 }" 29 }, 30 31 // File Upload Settings 32 file_size_limit: "2 MB", 33 file_types: "*.jpg;*.gif;", 34 file_types_description: "JPG Images", 35 file_upload_limit: 0, // Zero means unlimited 36 37 // Event Handler Settings - these functions as defined in Handlers.js 38 // The handlers are not part of SWFUpload but are part of my website and control how 39 // my website reacts to the SWFUpload events. 40 swfupload_preload_handler: preLoad, 41 swfupload_load_failed_handler: loadFailed, 42 file_queue_error_handler: fileQueueError, 43 file_dialog_complete_handler: fileDialogComplete, 44 upload_progress_handler: uploadProgress, 45 upload_error_handler: uploadError, 46 upload_success_handler: showImage, 47 upload_complete_handler: uploadComplete, 48 49 // Button settings 50 button_image_url: "/Content/SWFUpload/images/XPButtonNoText_160x22.png", 51 button_placeholder_id: "spanButtonPlaceholder", 52 button_width: 160, 53 button_height: 22, 54 button_text: ‘<span class="button">请选择图片<span class="buttonSmall">(2 MB Max)</span></span>‘, 55 button_text_style: ‘.button { font-family: Helvetica, Arial, sans-serif; font-size: 14pt; } .buttonSmall { font-size: 10pt; }‘, 56 button_text_top_padding: 1, 57 button_text_left_padding: 5, 58 59 // Flash Settings 60 flash_url: "/Content/SWFUpload/swfupload.swf", // Relative to this file 61 flash9_url: "/Content/SWFUpload/swfupload_FP9.swf", // Relative to this file 62 63 custom_settings: { 64 upload_target: "divFileProgressContainer" 65 }, 66 67 // Debug Settings 68 debug: false 69 }); 70 } 71 $(function () { 72 $("#btnCut").click(function () { 73 cutPhoto(); 74 }); 75 }); 76 77 //上传成功后 78 function showImage(file, serverData) { 79 var DataArray = serverData.split(":"); 80 if (DataArray[0] == "ok") { 81 $("#selectbanner").attr("src", DataArray[1]); 82 $(‘#selectbanner‘).imgAreaSelect({ 83 selectionColor: ‘blue‘, x1: 0, y1: 0, x2: 50, 84 85 y2: 50, selectionOpacity: 0.2, onSelectEnd: preview 86 }); 87 } 88 else 89 { 90 alert(DataArray[1]); 91 } 92 } 93 94 //头像截取 95 function cutPhoto() 96 { 97 var params={ 98 x:$("#selectbanner").data("x"), 99 y:$("#selectbanner").data("y"), 100 width:$("#selectbanner").data("w"), 101 height:$("#selectbanner").data("h"), 102 imgUrl:$("#selectbanner").attr("src") 103 }; 104 $.post("/UserInfoManager/CutPhoto",params, function (url) { 105 $("#cutPhoto").attr("src",url); 106 }); 107 } 108 109 //截图完毕 110 function preview(img, selection) { 111 112 $(‘#selectbanner‘).data(‘x‘, selection.x1); 113 114 $(‘#selectbanner‘).data(‘y‘, selection.y1); 115 116 $(‘#selectbanner‘).data(‘w‘, selection.width); 117 118 $(‘#selectbanner‘).data(‘h‘, selection.height); 119 120 } 121 122 //头像截取 123 </script> 124 } 125 <div id="content"> 126 <div id="swfu_container" style="margin: 0px 10px;"> 127 <div> 128 <span id="spanButtonPlaceholder"></span> 129 </div> 130 <div id="divFileProgressContainer" style="height: 75px;"></div> 131 <div id="thumbnails"></div> 132 <img id="selectbanner"/> 133 <input type="button" id="btnCut" value="头像截取" /> 134 <br /> 135 <img id="cutPhoto" /> 136 137 </div> 138 </div>
1 #region 文件上传 2 public ActionResult Upload() 3 { 4 //接受文件数据 5 HttpPostedFileBase file=Request.Files["FileData"]; 6 7 //获得文件名和文件扩展名 8 string fileName = Path.GetFileName(file.FileName); 9 string fileExt = Path.GetExtension(fileName); 10 11 if(fileExt==".jpg") 12 { 13 //创建文件夹 14 string dir = "D:/VS 2013/图书商城/WHL.BookShop.WebUI/UploadImage/" + DateTime.Now.Year + "/"+DateTime.Now.Month + "/"+DateTime.Now.Day+"/"; 15 DirectoryInfo d= Directory.CreateDirectory(Path.GetDirectoryName(dir)); 16 string fullDir = dir + StreamExtension.GetMD5(file.InputStream) + ".jpg"; 17 //保存原图 18 file.SaveAs(fullDir); 19 string thumbPath =Guid.NewGuid().ToString(); 20 //缩略图 21 Common.ImageClass.MakeThumbnail(fullDir, Request.MapPath("/UploadImage/"+thumbPath) + ".jpg", 200, 300, "w"); 22 //文字 23 Common.ImageClass.LetterWatermark(Request.MapPath("/UploadImage/"+thumbPath+".jpg"),20,"翠氛围范文芳花",System.Drawing.Color.Red,"180"); 24 using(Image pic=Image.FromFile(Request.MapPath("/UploadImage/"+thumbPath+".jpg"))) 25 { 26 return Content("ok:"+"/UploadImage/"+thumbPath+".jpg"+":"+pic.Width+":"+pic.Height); 27 } 28 29 } 30 else 31 { 32 return Content("error:文件格式错误!"); 33 } 34 35 } 36 #endregion 37 38 #region 头像截取 39 public ActionResult CutPhoto() 40 { 41 int x = string.IsNullOrEmpty(Request["x"]) ? 0 : Convert.ToInt32(Request["x"]); 42 int y = string.IsNullOrEmpty(Request["y"]) ? 0 : Convert.ToInt32(Request["y"]); 43 int width = string.IsNullOrEmpty(Request["width"]) ? 0 : Convert.ToInt32(Request["width"]); 44 int height = string.IsNullOrEmpty(Request["height"]) ? 0 : Convert.ToInt32(Request["height"]); 45 string imgUrl = string.IsNullOrEmpty(Request["imgUrl"])? "" : Request["imgUrl"]; 46 47 //先创建指定宽高的画布 48 //创建图片,并在画布上根据 图片指定绘制部分 绘制新的图片 49 //将画布保存起来,并且指定图片类型(减少图片的大小) 50 using(Bitmap map=new Bitmap(width,height)){ 51 using(Graphics g=Graphics.FromImage(map)) 52 { 53 using (Image img = Image.FromFile(Request.MapPath(imgUrl))) 54 { 55 g.DrawImage(img,new Rectangle(0,0,width,height),new Rectangle(x,y,width,height),GraphicsUnit.Pixel); 56 } 57 } 58 string guid=Guid.NewGuid().ToString(); 59 map.Save(Request.MapPath("/UploadImage/" + guid + ".jpg"), System.Drawing.Imaging.ImageFormat.Jpeg); 60 return Content("/UploadImage/"+guid+".jpg"); 61 } 62 } 63 #endregion
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。