update

前端/前端通过页面(dom)生成图片.md

@@ -0,0 +1,38 @@
+```
+let rem = parseFloat($("html").css("font-size"))
+let width = 17.25 * rem
+var canvas2 = document.createElement("canvas");
+var _canvas = document.getElementById('app');
+var w = parseInt(window.getComputedStyle(_canvas).width);
+var h = parseInt(window.getComputedStyle(_canvas).height);
+//将canvas画布放大若干倍，然后盛放在较小的容器内，就显得不模糊了
+var times = 3;
+// var times = 20;
+canvas2.width = w * times  * window.devicePixelRatio;
+canvas2.height = h * times  * window.devicePixelRatio;
+canvas2.style.width = w + "px";
+canvas2.style.height =h + "px";
+console.log(w,h)
+var context = canvas2.getContext("2d");
+context.scale(times, times);
+console.log(canvas2.style.width)
+    new html2canvas(document.getElementById('app'), {
+        canvas:canvas2,
+        allowTaint: true,
+        taintTest: true,
+        useCORS: true,
+        background: null,
+        windowWidth:document.body.scrollWidth,
+        windowHeight:document.body.scrollHeight,
+        x:(document.body.scrollWidth - width) / 2,
+        y:0
+    }).then(canvas => {
+        let imgUrl = `<img style="width:100%" src="${canvas.toDataURL()}" />`
+            doinghide()
+            $('#app').replaceWith('<div id="app"></div>')
+            $('#app').css('padding',0)
+            $('#app').append(imgUrl)
+    });
+    }
+})
+```