1

署名パッドを試して、例の1つをうまく設定しています。しかし、画像をjpegなどに保存する方法がわかりません。

画像を保存してプレースホルダーに表示しようとしているので、それが機能することがわかります。

以下は私のコードです:

デフォルト.aspx

<head runat="server">
<script src="scripts/jquery.min.js"></script>
<script src="scripts/jquery.signaturepad.min.js"></script>
<script src="scripts/json2.min.js"></script>

 <link rel="stylesheet" href="scripts/jquery.signaturepad.css"/>
   <script type="text/javascript"> 
       $(document).ready(function () {
           $('.sigPad').signaturePad({ drawOnly: true });

       });


</script>
     <title></title>
</head>
<body>
    <form id="form1" runat="server" class="sigPad">
 <label for="name">Print your name</label>
  <input type="text" name="name" id="name" class="name"/>
  <p class="drawItDesc">Draw your signature</p>
  <ul class="sigNav">
    <li class="drawIt"><a href="#draw-it">Draw It</a></li>
    <li class="clearButton"><a href="#clear">Clear</a></li>
  </ul>
  <div class="sig sigWrapper">
    <div class="typed"></div>
    <canvas class="pad" width="198" height="55"></canvas>
    <input type="hidden" name="output" class="output"/>
  </div>
  <button type="submit">I accept the terms of this agreement.</button>

        <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
    </form>
</body>
</html>

Default.aspx.cs

  protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            var sigToImg = new SignatureToImage();
            var signatureImage = sigToImg.SigJsonToImage(signatureJson);

            // I want to be able to add the image to Placeholder1 after the post back
        }
    }
4

6 に答える 6

2
 //HTML5
<div id="sketch" style="width: 400px; height: 245px; border: 1px solid #999999;float:left">
<canvas id="signature"></canvas>
</div>

//Javascript

var mycanvas = document.getElementById("signature"); //get your canvas
var image = mycanvas.toDataURL("image/png"); //Convert
document.getElementById("imgsaveSignature").src = image;
document.getElementById("imgsaveSignature").style.display = "inline";
image = image.replace('data:image/png;base64,', '');
document.getElementById("hdnSignatureImageData").value = image;

//in the code behind


 Using fs As New FileStream(SignatureImgPath, FileMode.Create)
     Using bw As New BinaryWriter(fs)
         Dim data As Byte() = Convert.FromBase64String(hdnSignatureImageData.Value)
         bw.Write(data)
         bw.Close()
     End Using
     fs.Close()
 End Using
于 2014-06-05T21:15:03.737 に答える
0

これらの行を使用します

System.IO.MemoryStream ms = New System.IO.MemoryStream();
Bitmap signatureImage  = New Bitmap(800, 800);

signatureImage  = SignObj.SigJsonToImage(signatureJson);
signatureImage .Save(ms, Imaging.ImageFormat.Bmp);
signatureImage .Save("FilePath/" + "image.png");

画像は指定されたパスに保存され、この画像をどこでも使用できます

于 2014-01-09T06:51:45.087 に答える
0

私は上記の多くを試しましたが、上記のすべてが機能しませんでした。次のコードを試しましたが、うまくいきました。

これは含まれます

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using SignaturePad.fonts.Controllers;
using SignaturePad.models;
using SignaturePad.Controllers;
using System.Drawing;
using System.Drawing.Imaging;

これらはコードです。ビットマップ画像を保存します

var sigToImg = new SignatureToImage();
var signatureImage = sigToImg.SigJsonToImage(/*Bipmapstring which we nees to convert to immage or the string return by output hidden field*/);          
Bitmap myBitmap;
        ImageCodecInfo myImageCodecInfo;
        Encoder myEncoder;
        EncoderParameter myEncoderParameter;
        EncoderParameters myEncoderParameters;

        // Create a Bitmap object based on a BMP file.
        myBitmap = new Bitmap(signatureImage);

        // Get an ImageCodecInfo object that represents the JPEG codec.
        myImageCodecInfo = GetEncoderInfo("image/jpeg");

        // Create an Encoder object based on the GUID 

        // for the Quality parameter category.
        myEncoder = Encoder.Quality;

        // Create an EncoderParameters object. 

        // An EncoderParameters object has an array of EncoderParameter 

        // objects. In this case, there is only one 

        // EncoderParameter object in the array.
        myEncoderParameters = new EncoderParameters(1);

        myEncoderParameter = new EncoderParameter(myEncoder, 75L);
        myEncoderParameters.Param[0] = myEncoderParameter;
        myBitmap.Save(Server.MapPath("/Content/Shapes050.jpg"), myImageCodecInfo, myEncoderParameters);/Content/Shapes050.jpg:is server path
于 2014-06-19T08:00:33.447 に答える
0

キャンバスの後に入力タイプがあります。それに ID を与え、runat="server" を追加します。signatureJson を Id.Value に置き換えます。それはうまくいくはずです。

于 2013-10-31T05:38:04.127 に答える