html2canvas爲具有來自同一來源的多個圖像的html頁面

我在html頁面中有多個圖像。我想使用html2canvas將頁面轉換爲圖像。圖像是本地的並且來自相同的源。它始終保持顯示錯誤msg 「無法從畫布獲取圖像數據，因爲畫布已被交叉源數據污染。」html2canvas爲具有來自同一來源的多個圖像的html頁面

相同的代碼將適用於一個圖像或同一圖像的多個副本。

<!DOCTYPE HTML> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="language" content="de"> 
    <script type="text/javascript" src="./js/jquery-1.9.1.js"></script> 
    <script type="text/javascript" src="js/html2canvas.min.js"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     var target = $('#mainDiv'); 
     html2canvas(target, { 
      onrendered: function(canvas) { 
      var data = canvas.toDataURL(); 
      var img = document.getElementById('img1'); 
      img.src = data; 
      } 
     }); 
     }); 
    </script> 
    </head> 
    <body> 
    <div id="mainDiv"> 
    <div id="div1" ><p>paragraph 1 paragraph 1 paragraph 1 paragraph 1 paragraph 1 paragraph 1 paragraph 1 paragraph 1 </p></div> 
    <div id="div2" ><p>paragraph2 paragraph2 paragraph2 paragraph2 paragraph2 paragraph2 paragraph2 paragraph2 </p></div> 
    <img src="images/01.jpg" > 
     <img src="images/02.jpg" > 
     <img src="images/03.jpg" > 
     <img src="images/04.jpg" > 
    </div> 
    <img id="img1"></img> 
    </body> 
</html>

我不知道什麼是錯誤消息mean.Also如果有人能告訴我如何使多個圖像這項工作，這將是非常有益的

來源

2013-03-14 Dineswor

刪除你不要有什麼需要。即，i具有Div1構成，Div2的等

 function PrintChartCanvas(divId) { 
      //div canvas 
      var divObj = html2canvas($('#div' + divId)); 
      var divQueu = divObj.parse(); 
      var divCanvas = divObj.render(divQueu); 
      divImg = divCanvas.toDataURL(); 

      return divImg; 
     }

的document.getElementById（「IMG1」）SRC = PrintChartCanvas（3）。

這應該工作

來源

2013-07-29 09:08:57 Mshini

html2canvas爲具有來自同一來源的多個圖像的html頁面

回答

相關問題