之前的方案确实可以打印出a4的大小的pdf,但是也呈现了诸多问题,因为这种方法是截图然后再进行打印的,所以打印出来的效果是模糊的,思前想后决定放弃了这种方式.

最终还是决定使用浏览器自带的打印方法.

设置打印按钮

添加打印事件

去除不需要打印的部分

这样打印文件所呈现的效果就截然不同,清晰度得到很大改善.

然后再为页面设置背景图以及贴图

使用html2canvas截图并用jspdf打印的问题的更多相关文章

  1. html2canvas截图白边显示问题

    html2canvas(document.getElementById('resource_chart'),{ useCORS:true, logging:false, width:$('#resou ...

  2. 利用html2canvas截图，得到base64上传ajax

    <script type="text/javascript" src="js/html2canvas.js"></script> //布 ...

  3. html2canvas截图问题，图片跨域导致截图空白

    年前的一个项目,要做一个H5截屏分享的功能,使用的是html2canvas插件,截图功能是实现了,但是跨域的图片死活不出来, 经过几天谷歌百度和不断的尝试,终于找到解决办法了,一共经历了让人心力憔悴的 ...

  4. 网页转图片--- html2canvas截图

    最近有个做在线名片(可保存图片至本地)的任务,特意研究了一下图片生成,也踩了几个坑.特此总结一下,顺便分享一下demo: 链接:https://pan.baidu.com/s/1o98UBJO 密码: ...

  5. 前端使用html2canvas截图，在canvas上绘制图片及保存图片

    1.使用html2canvas 存在的问题: 不同的机型绘制位置不同的问题. 这个主要因为Html动态设置了html的dpr.(dpr可以解决屏幕显示不了1pxborder和无法显示小于12px的文字 ...

  6. js实现html转pdf+html2canvas.js截图不全的问题

    最近做项目中遇到要把整个页面保存为PDF文件,网上找了一下实现的方法都是 html2canvas.js+jsPdf.js 来实现.实现的过程是 先用html2canvas.js把html页面转成图片, ...

  7. 纯前端html导出pdf--分页+不分页--html2canvas+jsPDF

    前言 最近在项目中,有一个导出pdf功能,需要纯前端来实现,调研了多种pdf导出方式,最终决定使用html2canvas+jsPDF来实现需求. 本文就简单介绍一下html2canvas+jsPDF导 ...

  8. html2canvas 网页截图 下载 上传

    利用html2canvas插件 对网页截图 并下载和上传图片. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//E ...

  9. js截图及绕过服务器图片保存至本地（html2canvas）

    今天要分享的是用html2canvas根据自己的需求生成截图,并且修复html2canvas截图模糊,以及绕过服务器图片保存至本地. 只需要短短的几行代码,就能根据所需的dom截图,是不是很方便,但是 ...

随机推荐

  1. C#预编译的问题

    C#预编译宏并不像C++那样编译之后就不存在了.在UNITY的C#脚本中 #if UNITY_ANDROID && !UNITY_EDITOR AndroidJavaClass jc ...

  2. 迷你MVVM框架 avalonjs 学习教程9、类名操作

    ms-class是avalon用得最多的几个绑定之一,也正因为如此其功能一直在扩充中.根据时期的不同,分为旧风格与新风格两种. 旧风格是指ms-class-xxx=”expr”,*ms-class-a ...

  3. 迷你MVVM框架 avalonjs 1.3.5发布

    本版本主要是修复内存泄漏问题,让其在移动端更好的运作. 修正visible BUG 详见这里 修正$fire方法里的正则错误 详见这里 修正ms-attr BUG,在IE9-11,直接用element ...

  4. docker swarm test

    consul: 192.168.111.111: docker run -d -p 8500:8500 --name=consul progrium/consul -server -bootstrap ...

  5. 安装zoom

    ubuntu zoom下载地址:https://zoom.us/download?os=linux 安装: sudo apt-get install libxcb-xtest0 sudo dpkg - ...

  6. Wap版

    Wap版:又叫h5.M版.移动网页版: Mobile:存储wap版调用的接口

  7. qt4代码到qt5代码出错

    1.error C2039: “toAscii”: 不是“QString”的成员 QT5.0.1把这个函数取消掉了,可以用toLatin1这个函数

  8. MDK5使用技巧

    1.文本美化 修改 修改字体以及颜色如下: 修改用户自定义的关键字,如下: 代码编辑技巧 1.TAB键的妙用 使用TAB键可以整体向右移动相应位,使用SHIFT+TAB键整体左移相应位. 2.快速定位 ...

  9. GO语言使用gopsutil包进行机器信息采集

    GO语言本身拥有极强的性能,非常适合做一些后端的数据采集管理以及运维系统. 其中会面临对当前系统信息的采集,我在这里使用的是GO的工具包 gopsutil 贴出一套测试代码,抛砖引玉: import ...

  10. 前端福利之个性化设置table的td宽度（总结）

    很多时候,我们在用到table时,都希望随意设置 每个单元格的宽度,而不希望单元格被内容撑开table的样式. 1.首先,设置table的宽度 width=“1000” 或者 width=“100%” ...