import html2canvas from "html2canvas";
htmlToImg(str) {
if (this.isSavingImg) {
return false;
}
let zoom = 2.5;
let elem = document.querySelector(str);
var scale = zoom;
var width = $(elem).width();
var height = $(elem).height();
var canvas = document.createElement("canvas");
canvas.width = width * scale;
canvas.height = height * scale;
var context = canvas.getContext("2d");
context.mozImageSmoothingEnabled = false;
context.webkitImageSmoothingEnabled = false;
context.msImageSmoothingEnabled = false;
context.imageSmoothingEnabled = false;
context.scale(zoom, zoom);
var opts = {
scale: 1,
canvas: canvas,
logging: false,
width: width,
height: height,
useCORS: true
};
try {
this.isSavingImg = true;
$.toast("图片保存中,请稍后...");
html2canvas(elem, opts).then(canvas => {
$(".item-char").removeClass("mt20");
var imgUri = canvas.toDataURL("image/jpeg");
this.uploadToSth(this.dataURLtoBlob(imgUri));
});
} catch (e) {
this.isSavingImg = false;
}
}
dataURLtoBlob(dataurl) {
var arr = dataurl.split(","),
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], { type: "image/png" });
}