欢迎光临

木子屋

标题: ASP.NET+JQuery.imgAreaSel&#101;ct在线裁切图片示例

作者: dnawo

日期: 2011-01-16 02:47 PM

分类: Web编程

内容:
ASP.NET代码：
复制内容到剪贴板 程序代码<%@ Page Language="C#" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script runat="server">
protected void btnSave_Click(object sender, EventArgs e)
{
int x1 = int.Parse(txtX.Text);
int y1 = int.Parse(txtY.Text);
int x2 = int.Parse(txtX2.Text);
int y2 = int.Parse(txtY2.Text);
DrawImage(Server.MapPath("Images/demo.jpg"), Server.MapPath("Images/new.jpg"), x1, y1, x2 - x1, y2 - y1);

Response.Redirect("Images/new.jpg");
}
protected void DrawImage(string srcImage, string destImage, int x, int y, int width, int height)
{
using (System.Drawing.Image sourceImage = System.Drawing.Image.FromFile(srcImage))
{
using (System.Drawing.Image templateImage = new System.Drawing.Bitmap(width, height))
{
using (System.Drawing.Graphics templateGraphics = System.Drawing.Graphics.FromImage(templateImage))
{
templateGraphics.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.High;
templateGraphics.SmoothingMode = System.Drawing.Drawing2D.SmoothingMode.HighQuality;
templateGraphics.DrawImage(sourceImage, new System.Drawing.Rectangle(0, 0, width, height), new System.Drawing.Rectangle(x, y, width, height), System.Drawing.GraphicsUnit.Pixel);
templateImage.Save(destImage, System.Drawing.Imaging.ImageFormat.Jpeg);
}
}
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>JQuery.imgAreaSelect示例-Mzwu.Com</title>
<link href="Style/imgareaselect-default.css" rel="stylesheet" type="text/css" />
<script src="Jscript/jquery.min.js" type="text/javascript"></script>
<script src="Jscript/jquery.imgareaselect.pack.js" type="text/javascript"></script>
<script type="text/javascript">
.ready(function(){
$('#ladybug').imgAreaSelect({onSelectEnd:updateCoords});
});

function updateCoords(img,c)
{
$('#txtX').val(c.x1);
$('#txtY').val(c.y1);
$('#txtX2').val(c.x2);
$('#txtY2').val(c.y2);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<img id="ladybug" src="Images/demo.jpg" />
<br />
x:<asp:TextBox ID="txtX" runat="server" Width="50px"></asp:TextBox>
y:<asp:TextBox ID="txtY" runat="server" Width="50px"></asp:TextBox>
x2:<asp:TextBox ID="txtX2" runat="server" Width="50px"></asp:TextBox>
y2:<asp:TextBox ID="txtY2" runat="server" Width="50px"></asp:TextBox>
<asp:Button ID="btnSave" runat="server" Text="Save" onclick="btnSave_Click" />
</div>
</form>
</body>
</html>
资料参考
·官方站点：http://odyniec.net/projects/imgareaselect/
·示例下载：http://www.mzwu.com/pic/201101/demo_JQuery.imgAreaSelect.rar

+ 查看当前日志评论 (0)

登录

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.340 ms

返回

标题: ASP.NET+JQuery.imgAreaSel&#101;ct在线裁切图片示例

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.340 ms

返回

暂无评论

返回

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 2.387 ms

返回