Vue 页面内容利用canvas做成导出图片

import html2Canvas from "html2canvas";

downloadIamge() {
      let that = this;
      html2Canvas(document.getElementById("export_content"), {
       useCORS:true,//解决canvas跨域
       allowTaint:false
      }).then(function(canvas) {
        let contentWidth = canvas.width;
        let contentHeight = canvas.height;
        let pageHeight = (contentWidth / 592.28) * 841.89;
        let leftHeight = contentHeight;
        let position = 0;
        let imgWidth = 595.28;
        let imgHeight = (592.28 / contentWidth) * contentHeight;
        let pageData = canvas.toDataURL("image/jpeg", 1.0);
        var a = document.createElement('a')
        var event = new MouseEvent('click')
        a.download = 'xx分析报告'
        a.href = pageData
        a.dispatchEvent(event)
      });
    }
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

友情链接更多精彩内容