html2canvas以及new QRCode生成带有二维码的海报的问题

全局定义new QRCode
var posterQrCode = new QRCode(document.getElementById("qrcode"), {// text: data,width: 82,height: 82,correctLevel: 3 // 解决二维码识别不高的问题});
取消修改的时候给posterQrCode传值posterQrCode.makeCode(data);

解决二维码海报弹框出现顶部空挡的问题以及图片模糊问题
function createQrCode(data) {var canvas2 = document.createElement("canvas");var shareContent = document.getElementById("posterId");var w = parseInt(window.getComputedStyle(shareContent).width);var h = parseInt(window.getComputedStyle(shareContent).height);var context = canvas2.getContext("2d"); //获取2d上下文对象，大多数Canvas API均为此对象方法canvas2.width = w * 2;canvas2.height = h * 2;canvas2.style.width = w + "px";canvas2.style.height = h + "px";context.scale(2, 2); //绘图将定位于距离画布左上角两倍远的位置window.pageYoffset = 0;document.documentElement.scrollTop = 0;document.body.scrollTop = 0;var rect = shareContent.getBoundingClientRect(); //获取元素相对于视察的偏移量console.log(rect, 'rect', -rect.left, -rect.top);context.translate(-rect.left, -rect.top); //设置context位置，值为相对于视窗的偏移量负值，让图片复位html2canvas(shareContent, {canvas: canvas2,useCORS: true,backgroundColor: "#fff",width: w,height: h}).then(function (canvas) {sharePosturl = canvas.toDataURL();$(".canvasImg").attr('src', sharePosturl);//$(".can-content").click(function (e) {//   e.stopPropagation();// });});}

 var canvas2 = document.createElement("canvas");var shareContent = document.getElementById(posterDiv);console.log(shareContent, 'shareContent');var width = parseInt(window.getComputedStyle(shareContent).width);var height = parseInt(window.getComputedStyle(shareContent).height);context = canvas2.getContext("2d");scale = 3;canvas2.width = width * scale; //设置放大倍数,保证清晰度canvas2.height = height * scale; //设置放大倍数,保证清晰度canvas2.style.width = width + "px";canvas2.style.height = height + "px";context.scale(scale, scale); //设置放大倍数与上面的宽高对应window.pageYoffset = 0;document.documentElement.scrollTop = 0;document.body.scrollTop = 0;var rect = shareContent.getBoundingClientRect(); //获取元素相对于视察的偏移量context.translate(-rect.left, -rect.top); //设置context位置，值为相对于视窗的偏移量负值，让图片复位html2canvas(shareContent, {// allowTaint: true,// taintTest: false,canvas: canvas2,useCORS: true,width: width,height: height,// scale: 2, // 处理模糊问题// dpi: 300, // 处理模糊问题/*windowWidth: document.body.scrollWidth,windowHeight: document.body.scrollHeight,x: 0,y: window.pageYOffset*/}).then(function (canvas) {$("#pageImg").attr('src', canvas.toDataURL());});