我想知道html2canvas何时完全呈现捕获,并且可以清理对页面所做的更改。

如果我立即重置样式和位置,则将获得半分辨率的捕获。

html2canvas(srcEl,
  {
    canvas: scaledCanvas,
    width: originalWidth,
    height: originalHeight
  }).then(function (canvas) {
  var a = document.createElement("a");
  a.download = "chart.png";
  a.href = canvas.toDataURL("image/png");
  document.body.appendChild(a);
  a.click();
  /*
  srcEl.style.position = '';
  srcEl.style.left = '';
  srcEl.style.top = '';
  */
});


}

最佳答案

在html2canvas 0.4及以下版本中,使用了回调方法。 Old documentation 0.5之后,它被重写为使用Promises New documentation

Old way



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

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>

<div id="target">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque quis eleifend elit. Donec lectus sem, scelerisque sit amet facilisis quis, gravida a lacus. Nunc at lorem egestas, gravida lorem quis, pulvinar ante. Quisque id tempus libero. Mauris hendrerit nunc risus, ac laoreet lectus gravida et. Nam euismod magna ac enim posuere sagittis. Fusce at egestas enim, eu hendrerit enim.
</div>

<button onclick="takeScreenShot()">to image</button>





New way

关于javascript - 我怎么知道html2canvas何时完成?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/42357469/

10-12 12:25