html2canvas 空白
2020-05-19 本文已影响0人
Astep
截取空白原因
百度、谷歌了n久,基本啥方法都试了一遍,还是一直截取空白
主要固原是因为页面有滚动条,然后把滚动条去掉就没有问题。
文档使用方法
html2canvas(document.getElementById("drag_box")).then(canvas=> {
document.body.appendChild(canvas);
this.url = canvas.toDataURL("image/png");
});
按照这个方式使用,页面没有滚动条还行,有滚动条时出现大片空白。
解决方案
// 获取元素
let dome = document.getElementById("drag_box");
// 生成的时候一定要转入 x 跟 y 轴,如果不传还是会空白
html2canvas(dome, {
x: dome.offsetLeft,
y: dome.offsetTop
}).then(canvas => {
document.body.appendChild(canvas);
this.url = canvas.toDataURL("image/png");
});