zoukankan      html  css  js  c++  java
  • jQuery+Asp.net结合实现图片截图

    这是在公司写的 ,所有是vb 别介意

    页面代码

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="CreateImage.aspx.vb" Inherits="CreateImage" %>

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
    <title></title>
    <link href="css/imgareaselect-default.css" rel="stylesheet" type="text/css" />
    <script src="JS/jquery-1.5.min.js" type="text/javascript"></script>
    <script src="JS/jquery.imgareaselect.pack.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(
    function() {
    $(
    'img#photo').imgAreaSelect({ handles: true,
    onSelectEnd:
    function(img, selection) {
    //$("#show").html("");
    //$("#show").append(selection.x1 + "#" + selection.y1 + "#" + selection.width + "#" + selection.height);
    $("#TextBox2").val(selection.x1);
    $(
    "#TextBox3").val(selection.y1);
    $(
    "#TextBox4").val(selection.width);
    $(
    "#TextBox5").val(selection.height);
    }
    });
    });
    </script>
    </head>
    <body>
    <form id="form1" runat="server">
    <img src="images/0001.jpg" id="photo" />
    <div id="show">
    <asp:TextBox ID="TextBox2" runat="server" Text="0"></asp:TextBox>
    <asp:TextBox ID="TextBox3" runat="server" Text="0"></asp:TextBox>
    <asp:TextBox ID="TextBox4" runat="server" Text="0"></asp:TextBox>
    <asp:TextBox ID="TextBox5" runat="server" Text="0"></asp:TextBox>
    </div>
    <asp:Button ID="Button2" runat="server" Text="剪裁" />
    <br />
    <img src="images/Pic.jpg" id="PicBox" runat="server" style="border: 1px solid #ccc;
    padding: 2px;"
    />
    </form>
    </body>
    </html>

    后台代码

    View Code
    Protected Sub Button2_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles Button2.Click
    Dim x As Integer = CType(CType(Me.FindControl("TextBox2"), TextBox).Text, Integer)
    Dim y As Integer = CType(CType(Me.FindControl("TextBox3"), TextBox).Text, Integer)
    Dim width As Integer = CType(CType(Me.FindControl("TextBox4"), TextBox).Text, Integer)
    Dim height As Integer = CType(CType(Me.FindControl("TextBox5"), TextBox).Text, Integer)
    Dim strPicUrl As String = "images/0001.jpg" '原图路径
    Dim strSavePicUrl As String = "D:\Project\Test001\images\Pic.jpg"

    Dim newImage As System.Drawing.Image = Image.FromFile(Server.MapPath(strPicUrl))
    'Dim newImage As System.Drawing.Image = System.Drawing.Image.FromStream(strPicUrl.InputStream, True)
    '定位
    Dim fromR As Rectangle = New Rectangle(x, y, width, height) ''原图裁剪定位
    Dim toR As Rectangle = New Rectangle(0, 0, width, height) ''目标定位

    Dim units As GraphicsUnit = GraphicsUnit.Pixel

    Dim pickedImage As System.Drawing.Image = New System.Drawing.Bitmap(toR.Width, toR.Height)
    Dim g As System.Drawing.Graphics = Graphics.FromImage(pickedImage)

    '清空画布
    g.Clear(Color.White)

    '设置质量
    g.InterpolationMode = System.Drawing.Drawing2D.InterpolationMode.HighQualityBicubic
    g.SmoothingMode
    = System.Drawing.Drawing2D.SmoothingMode.HighQuality

    '剪裁
    g.DrawImage(newImage, toR, fromR, units)

    '处理图像质量
    Dim codecs As ImageCodecInfo() = ImageCodecInfo.GetImageEncoders()
    Dim ici As ImageCodecInfo ' = System.DBNull
    For Each codec As ImageCodecInfo In codecs
    If codec.MimeType = "image/jpeg" Then
    ici
    = codec
    End If
    Next

    Dim ep As EncoderParameters = New EncoderParameters
    ep.Param(
    0) = New EncoderParameter(System.Drawing.Imaging.Encoder.Quality, CLng(100))


    'pickedImage.Save(strSavePicUrl, System.Drawing.Imaging.ImageFormat.Jpeg)
    pickedImage.Save(strSavePicUrl, ici, ep)

    newImage.Dispose()
    pickedImage.Dispose()
    g.Dispose()

    End Sub

    看不惯vb码的朋友 这有个网站可以自己转换:

    http://www.developerfusion.com/tools/convert/csharp-to-vb/

    该功能使用jQuery插件详细如下:

    http://odyniec.net/projects/imgareaselect/usage.html

  • 相关阅读:
    在已安装的PHP版本之间切换
    LDAP系列(一)完整的 LDAP + phpLDAPadmin安装部署流程
    如何关闭Windows自动更新
    win10安装SDK、JAVA、Python配置环境变量
    怎么看懂接口文档
    全面解析 Postman 工具
    API接口监控
    jmeter面试题
    Navicat for MySQL 连接数据库
    Linux系统
  • 原文地址:https://www.cnblogs.com/xiaobuild/p/2085954.html
Copyright © 2011-2022 走看看