html2canvas无法获取整个图像

Question

我有一个非常长的网页，我想拍一张照片。

尺寸大约在1100x6600左右，每次使用html2canvas时，它都会获得整个宽度和长度，但图像最终只是我想要看到的一小部分。

是否有更简单的方法可以使整个图像适合1100x6600区域？

这是一段代码，它将标题的一部分放在图像的底部。

function getScreenshot(){
    html2canvas(document.getElementById("entireBody")).then(function(canvas) {
      var image = document.createElement("canvas");

      image.setAttribute('width', 1163);
      image.setAttribute('height', 6659);

      var context = image.getContext("2d");
      context.drawImage(canvas, 0, 0, 1163, 6659);

      var dataURL = image.toDataURL();

      window.open(dataURL);
    });
  }

Answer 1

我认为在使用html2canvas时我遇到了类似的问题。我发现屏幕上没有的页面部分没有放入画布。

我已经为此暂时解决了这个问题，通过稍微更改库来渲染我想要的所有部分，即使它们不在屏幕上。

使用版本0.5.0我改变了这一部分：

return renderDocument(node.ownerDocument, options, node.ownerDocument.defaultView.innerWidth, node.ownerDocument.defaultView.innerHeight, index)

至

return renderDocument(node.ownerDocument, options, 10000, 10000, index)

这实际上是告诉html2canvas在可见窗口之外渲染（10,000像素的宽度和高度）。我将它改为10000，因为它符合我的需要，但如果你愿意，你可以在这里做一些更直观的事情。

我看到该项目正在积极开发，所以希望这个问题得到解决，但同时，我希望这有帮助！