HTML2Canvas使用总结
阅读原文时间:2023年07月09日阅读:1

1:指定要生成的DOM元素id

2: 某些图片动态赋值src的url或者base64可能不会被立即渲染;可以设置一个定时器解决

3:可以调用次方法得到的canvas元素转一下格式 png/jpg

4: uniapp中使用时scale设定4倍移动端不模糊

5: 线上图片需要后端设置允许跨域访问

var copyDom = document.querySelector('#sxh');
const width = copyDom.offsetWidth;
const height = copyDom.offsetHeight;
let scale = 4; // 设定倍数这样不会模糊
html2canvas(copyDom, {
width:width,
heigth:height,
windowHeight:height,
windowWidth:width,
scale:scale,
scrollX:0,
scrollY:0,
y:0,
useCORS: true,
// allowTaint: true,
// backgroundColor:"#2ab77d",
}).then((canvas) => {
var url = canvas.toDataURL("image/png", 1.0).replace("image/png","image/octet-stream");//图片地址

手机扫一扫

移动阅读更方便

阿里云服务器
腾讯云服务器
七牛云服务器

你可能感兴趣的文章