将html doc转为pdf,js将html转换为pdf

js将html转换为pdf

所需引入文件

html2canvas和jsPdf.debug.js和jquery.min.js

贴代码：

点击下载，所需转换pdf的节点

我所遇到的问题是没有左右边距，。所以我将imgwidth调整了下大小。addImage左边距定义大小

一下为代码：

var downPdf = document.getElementById("renderPdf");

var s = document.getElementById("22");

downPdf.onclick = function() {

html2canvas(s, {

scale: 2,

useCORS: true,

onrendered: function(canvas) {

var imgData = canvas.toDataURL("image/png",1.0);

var imgWidth = 555.28; //297

var pageHeight = 592.28; //297

var imgHeight = canvas.height * imgWidth / canvas.width;

var heightLeft = imgHeight;

// var doc = new jsPDF('l', 'mm',[1350, 1350]);

var doc = new jsPDF('', 'pt', 'a4');

var position = 0; //0//上边距

margins = {

top: 20,

bottom: 10,

left: 45,

width: 522

};

doc.internal.scaleFactor = 1.33;

if (heightLeft < pageHeight) {

doc.addImage(imgData, 'JPEG', 20, position, imgWidth, imgHeight );

} else {

while(heightLeft > 0) {

pdf.addImage(imgData, 'JPEG', 20, position, imgWidth, imgHeight)//20为左边距

heightLeft -= pageHeight;

position -= 841.89;

//避免添加空白页

if(heightLeft > 0) {

pdf.addPage();

}

background: "#fff",

doc.save("2.pdf");

}

});

}

将html doc转为pdf,js将html转换为pdf相关推荐

js将html转成pdf,js将html转换为pdf
js将html转换为pdf 所需引入文件 html2canvas和jsPdf.debug.js和jquery.min.js 贴代码: 点击下载 ,所需转换pdf的节点我所遇到的问题是没有左右边距,. ...
fis3+vue+pdf.js制作预览PDF文件或其他
人生第一篇博客,的确有点紧张,但有些许兴奋,因为这对于我来说应该是一个好的开始,以此励志在技术的道路上越走越远. 看过了多多少少的技术博客,给自己带来了很多技术上的收获,也因此在想什么时候自己也可以赠 ...
android 在线解析pdf文件格式,Android PDF预览阅读：用Mozilla PDF.js浏览本地在线PDF文件 | KaelLi的博客...
在之前的Android端预览PDF方案一文中,曾经提到了使用Mozilla的PDF.js来加载PDF的办法,今天就详细的说一下具体的实现. 简介 PDF.js是一个使用HTML5构建的PDF查看器.由 ...
html 加载pdf文件内容不显示不出来,pdf.js首次加载pdf文件时找不到pdf文件，刷新后才能出现pdf文件...
前台点击文件学码的定一近,更工广款近,更工广款近,更名后,后台通过openoffice将doc文件转为pdf格式文件,然后存放在服务器tomcat'中,pdf.js首次加载服务器中tomcat中的转化 ...
不使用前端的pdf.js,通过pdfbox转换pdf为图片,拼接成html实现pdf前端预览
一般情况,pdf类型的文件在前端预览,都是通过前端插件,或者获取源文件浏览器自带的工具预览,由于项目中,是前后端分离,前端不想使用pdf.js类的插件,预览的要求又是只能看不能下载,所以只能另外想别的 ...
前端使用pdf.js插件在线浏览pdf
vue中使用PDF.js_没理由的花呗的博客-CSDN博客_pdf.js vue 步骤 1.官网下载pdf.js插件放入一个公用方法文件夹中如utils 2.在需要使用的页面使用iframe标签 &l ...
uniapp 使用pdf.js 加载本地pdf文件报错问题
最近有在做一个移动端的应用,应用里涉及到大量的js游戏开发,使用Android原生做不太合适,就选择了uniapp,其中有一个功能是读取本地的pdf文件并展示.在网上查了点资料都是用pdf.js来开发 ...
Asp.net Core 配合 PDFObject 和 pdf.js 在浏览器显示pdf文件
Asp.net Core 配合 PDFObject 和 pdf.js 在浏览器直接显示pdf文件测试环境的浏览器版本: Chrome :90.0.4430.93(64 位) FireFox :88. ...
springboot+vue整合pdf.js实现预览pdf
前景回顾: 上一次说到使用浏览器自带的预览pdf功能所遗留的问题,360浏览器不够给力,IE的我没测,估计也不行,于是乎我又翻阅资料(度娘)找到了一种新的实现方式,使用pdf.js实现如果想看使用浏 ...

将html doc转为pdf,js将html转换为pdf

将html doc转为pdf,js将html转换为pdf相关推荐

最新文章

热门文章