截图工具
Posted 天天611
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了截图工具相关的知识，希望对你有一定的参考价值。
前端截图domtoimage和html2canvas
domtoimage把节点截图 截图较为清晰
let node = document.getElementById("vbox");
domtoimage.toPng(node).then(function (dataUrl) {
this.imgUrl == "";
this.imgUrl = dataUrl;
if (this.imgUrl != "") {
this.handleGenerate();
} else {
alert("请签名或签名不完整!");
}
});
html2canvas 截图 相比来说 有些模糊 截图的大小在 vbox中设置
html2canvas(this.$refs.vbox).then(function (canvas) {
this.img == "";
this.img = canvas.toDataURL();
if (this.img != "") {
this.handleGenerate();
} else {
alert("请签名或签名不完整!");
}
});
或者
html2canvas(this.$refs.vbox，{
width: window.screen.availWidth,
height: document.getElementById("writediv").clientHeight - 2,
}).then(function (canvas) {
this.img == "";
this.img = canvas.toDataURL();
if (this.img != "") {
this.handleGenerate();
} else {
alert("请签名或签名不完整!");
}
});
以上是关于截图工具的主要内容，如果未能解决你的问题，请参考以下文章