问题描述
我正在研究 PWA 项目,该项目应该在用户输入数据后离线生成 pdf,到目前为止我使用的是 html2pdf 库,我可以生成 pdf,但是当我尝试为页脚添加一行时,它无法正确显示。这是它如何在 pdf
$(document).on("click","#btnViewVisits",function(){
$.get("http://127.0.0.1:8000/html/progressnotes.html",function(data) {
var opt = {
margin: 0.2,filename: 'NewVisit.pdf',image: { type: 'jpeg',quality: 1.0 },html2canvas: { scale: 2,bottom: 10 },jsPDF: { unit: 'in',format: 'letter',orientation: 'portrait' }
};
html2pdf().from(data).set(opt).toPdf().get('pdf').then(function (pdf) {
var totalPages = pdf.internal.getNumberOfPages();
for (i = 1; i <= totalPages; i++) {
pdf.setPage(i);
pdf.setFontSize(8);
pdf.line(0,pdf.internal.pageSize.getHeight() - 0.4,315,0);
//pdf.text('Page ' + i + ' of ' + totalPages,pdf.internal.pageSize.getWidth() - 1,pdf.internal.pageSize.getHeight() - 0.25);
}
}).save();
});
});
我在 pdf.line 中尝试了多个值,但它产生了粗线,第二个是斜线。非常感谢您对此的任何帮助。
解决方法
我终于能够通过更改 javascript 中的一些设置来解决这个问题,对于任何寻找解决方案的人,我正在发布 js 方法
$(document).on("click","#btnViewVisits",function(){
$.get("http://127.0.0.1:8000/html/progressnotes.html",function(data) {
var opt = {
margin: 5,filename: 'NewVisit.pdf',image: { type: 'jpeg',quality: 1.0 },html2canvas: { scale: 5 },jsPDF: { unit: 'mm',format: 'a4',orientation: 'portrait' }
};
html2pdf().from(data).set(opt).toPdf().get('pdf').then(function (pdf) {
var totalPages = pdf.internal.getNumberOfPages();
for (i = 1; i <= totalPages; i++) {
pdf.setPage(i);
pdf.setFontSize(8);
pdf.setLineCap(2);
pdf.line(3,pdf.internal.pageSize.getHeight() - 20,pdf.internal.pageSize.getWidth() - 2,pdf.internal.pageSize.getHeight() - 20);
pdf.text('Page ' + i + ' of ' + totalPages,pdf.internal.pageSize.getWidth() - 25,pdf.internal.pageSize.getHeight() - 10);
}
}).save();
});
});