使用 Html2Canvas 的文本区域截图

Question

我正在使用 html2canvas 库来截图。这是我的示例。

单击

to image

按钮时会截取文本区域的屏幕截图。

目前它忽略滚动条文本，仅截取文本区域上可见的屏幕截图。我想截取整个文本区域文本的屏幕截图。

window.takeScreenShot = function() {
  html2canvas(document.getElementById("target"), {
    onrendered: function(canvas) {
      document.body.appendChild(canvas);
    },
    width: 320,
    height: 220
  });
}

谁能帮我解决这个问题？非常感谢您的帮助。

谢谢

Answer 1

在截取屏幕截图之前，请设置文本区域高度以包含所有内容。然后在（demo）之后重置高度：

window.takeScreenShot = function() {
  var textarea = document.getElementById("target");
  textarea.style.height = textarea.scrollHeight + "px";
  html2canvas(textarea, {
    onrendered: function(canvas) {
      document.body.appendChild(canvas);
      textarea.style.height = "";
    },
    width: 320,
    height: textarea.offsetHeight
  });
}

Answer 2

我想问一下。您的演示中的示例使用了哪种版本的“html2canvas”？ 你能告诉我 JS 代码的存储位置吗？

我正在使用较新的版本，但正确存储文本区域有问题，我看到你的示例运行正常。

非常感谢！！！