Question

我正在使用html2canvas将div转换为image/png。当选定的div中有文本但是我有一个图像时，它工作正常。因此，当我点击按钮时，我无法通过base64看到创建的html2canvas图片中的图片。

我的代码是这样的;

这是我的剧本：

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="html2canvas.js"></script>

<script>
   $(function(){

      $('.savedraft').click(function(){

          html2canvas([ document.getElementById('div2image') ],{
          onrendered: function(canvas) {
          window.open(canvas.toDataURL());

  }
});
      })

      });         

</script>

这是我的身体：

<div class="savedraft">Convert</div>
<div id="div2image" >
    <img src="WebSite5/html2canvas-master/tests/assets/image_1.jpg" />
</div>

Answer 1

将其设置为div背景图片，应该正常工作！

Answer 2

使用canvas.toDataURL（“image / png”）指定图像类型

Answer 3

使用服务器运行项目，它将正常工作！

我遇到了同样的问题，但后来我使用visual studio运行该项目，它正在运行完美捕获div标签内的所有图像。 Read the link for further clarifications.

通过html2canvas（带有img里面的div元素）将div转换为图像而不捕获图像

3 个答案: