如何使用JSPDF在每个PDF页面(生成的)中设置页边距顶部

时间:2019-05-02 13:54:26

标签: jquery pdf jspdf html-to-pdf

我正在使用JSPDF在pdf中添加纯文本和图像徽标作为标题。 第一页工作正常,但是在生成的pdf的第二页上,HTML内容和我的标题都重叠了。我需要为来自HTML的内容留一些余量,以便标头和HTML内容可以分开。

var imgData = "data:image/jpeg;base64" + "," + base64Data;
var pdf = new jsPDF("l", "mm", "legal");
var source = $('#HTMLtoPDF')[0];

var specialElementHandlers = {
  '#skipForPDFReport': function (element, renderer) {
    return true
  }
};

var margins = {
  top: 40,
  bottom: 60,
  left: 40,
  width: 200,
};

pdf.fromHTML(
  source // HTML string or DOM elem ref.
  , margins.left // x coord
  , margins.top // y coord
  , {
    'width': margins.width, // max width of content on PDF,

    'elementHandlers': specialElementHandlers,
    style: {
      fontSize: 5
    }
  },
  function (dispose) {
    var totalPages  = pdf.internal.getNumberOfPages();
    console.log("total", totalPages);
    for(var i = totalPages; i >= 1; i--)
    { //make this page, the current page we are currently working on.
        pdf.setPage(i);                         
        pdf.addImage(imgData, 'JPEG', 37, 10, 35, 20);
        pdf.setFont("helvetica");
        pdf.setFontType("bold");
        pdf.setFontSize(22);
        pdf.setTextColor("#38a4ff");
        pdf.text(175, 22, name + " - " + "Report", "center");
        pdf.setFontType("normal");
        pdf.setFontSize(12);
        pdf.text(180, 30, "Report generated on " + Moment().format("MMMM Do YYYY, h:mm:ss a") + " by " + userName, 'center');
        pdf.setTextColor("black");

    }
    // dispose: object with X, Y of the last line add to the PDF
    // this allow the insertion of new lines after html
    pdf.save('report.pdf');
  }
)

0 个答案:

没有答案