2014-02-16 62 views
1

HTML: <div id='mydiv' name='mydiv' width='600' height='600' > <img src="clouds.png"></div>保存股利畫布圖像(JPEG),並自動保存在服務器

$(document).ready(function() 
    { 
     //alert("save pleaseeeee?"); 

     $("#save").click(function() 
     { 
      html2canvas([document.getElementById('mydiv')], 
      { 
      onrendered: function (canvas) 
      { 
       var canvas = document.getElementById('canvas'); 
       $.post("save.php", 
       { 
       data: canvas.toDataURL("image/jpeg") 
       }, 

       function (file) 
       { 
       window.location.href = "download.php?path="+ file 
       }); 
      }) 
     }); 
     // end of onclick save 
    }); 

只有一個畫布轉換爲圖像時自動保存工作。我試圖將它與html2canvas函數合併,以便我可以保存div-canvas-image。謝謝!

回答

1

您正在覆蓋html2canvas提供的畫布元素。嘗試直接用這樣的說法:

onrendered: function (canvas) // <- use this argument 
{ 
    /// This is overwriting the rendered canvas 
    //var canvas = document.getElementById('canvas'); 
    $.post("save.php", 
    { 
    data: canvas.toDataURL("image/jpeg") 
    }, 

    function (file) 
    { 
    window.location.href = "download.php?path="+ file 
    }); 
}) 

documentation

呈現的畫布在onrendered回調事件提供,如 例如:

html2canvas(element, { 
    onrendered: function(canvas) { 
     // canvas is the final rendered <canvas> element 
    } 
}); 
+0

我得到了它!非常感謝! :)) – user3316538