title: how to save multiple canvas into one image
body: <p>I want to save multiple canvas into one image using asp.net. I tried with with two canvases, but it is not saving. </p>
  
  <p>Canvas:</p>
  
  <pre><code>    &lt;div style="position:relative; width:456px; padding:0px; margin:0px;"&gt;
      &lt;canvas id="boardcanvas" width="456" height="480" style="position: absolute; left: 0;   top: -220px; z-index: 0;"&gt;&lt;/canvas&gt;
      &lt;canvas id="layer2" width="456" height="480" style="position: absolute;left: 0;   top:-220px; z-index: 1;"&gt;&lt;/canvas&gt;    
     &lt;/div&gt;
  
  
   &lt;input type="button" id="btnSave" style="width:150px ; text-align:center;height:30px" name="btnSave" value="Save as Image!" /&gt;
  </code></pre>
  
  <p>Jquery:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
       // Send the canvas image to the server.
       $(function () {
           $("#btnSave").click(function () {
  
               can1 = document.getElementById("broadcanvas");
               ctx1 = can1.getContext("2d");
               var coll = document.getElementById("layer2");
               ctx1.drawImage(coll, 0, 0);
               var image = can1.toDataURL("image/png");   
  
               alert(image);
               image = image.replace('data:image/png;base64,', '');
               $.ajax({
                   type: 'POST',
                   url: 'index.aspx/UploadImage',
                   data: '{ "imageData" : "' + image + '" }',
                   contentType: 'application/json; charset=utf-8',
                   dataType: 'json',
                   success: function (msg) {
                       alert('Image saved successfully !');
                   }
               });
           });
       });
  &lt;/script&gt;
  </code></pre>
  
  <p>index.aspx.cs:</p>
  
  <pre><code>using System.IO;
  using System.Web.Script.Services;
  using System.Web.Services;
  
  [ScriptService]
  public partial class index : System.Web.UI.Page
  {
      static string path = @"E:\Green\images\\";
      protected void Page_Load(object sender, EventArgs e)
      {
  
  
      }
      [WebMethod()]
      public static void UploadImage(string imageData)
      {
         string fileNameWitPath = path + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png";
         using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create))
          {
             using (BinaryWriter bw = new BinaryWriter(fs))
               {
                  byte[] data = Convert.FromBase64String(imageData);
                  bw.Write(data);
                  bw.Close();
               }
           }
       }
  }
  </code></pre>