html2pdf.js converts any webpage or element into a printable PDF entirely client-side using html2canvas and jsPDF.
在html2pdf.js中渲染过程是由html转称canvas,再由canvas转成pdf,但是作者明确指出在html5中canvas具有最大高度和宽度,超出最大限度便无法进行打印。
The basic workflow of html2pdf.js tasks (enforced by the prereq system) is:.from()->.toContainer()->.toCanvas()->.toImg()->.toPdf()->.save()
下载地址:
官方文档:
canvas限制各个浏览器支持情况:Chrome:
Maximumheight/width:32,767px
Maximumarea:268,435,456px(例如,16,384x16,384)
Firefox:
Maximumheight/width:32,767px
Maximumarea:472,907,776px(例如,22,528x20,992)
IE:
Maximumheight/width:8,192px
Maximumarea:N/A
IEMobile:
Maximumheight/width:4,096px
Maximumarea:N/A
按照官方示例编写一个测试页面:HTML>
HTML转PDF测试
/*Basicstylingforroot.*/
#root{
width:500px;
height:700px;
background-color:yellow;
}
生成PDF
测试内容
functiontest(){
//获取DIV元素
varelement=document.getElementById('root');
//生成PDF调用
html2pdf().from(element).set({
margin:1,
filename:'test.pdf',
html2canvas:{scale:2},
jsPDF:{orientation:'portrait',unit:'in',format:'letter',compressPDF:true}
}).save();
}
END