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页面

回答

相关问题