微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jspdf-autotable 中的多个页面

如何解决jspdf-autotable 中的多个页面

我在代码中使用了 jspdfjspdfAutoTable生成 pdf。

它在单个页面上运行良好,最多 23 行。一旦我添加了第 24 行(即出现在第二页上的行),一切都会扭曲。

page-1 pdf screenshot

我使用下面的代码生成 PDF

generatePdf(){
        const { jsPDF } = window.jspdf;
        const { jsPDFAutotable } = window.jspdfautotable;
        const doc = new jsPDF('landscape');//
        
        var totalPagesExp = doc.internal.getNumberOfPages();// '{total_pages_count_string}' ==> the output becomes Page 1 of '{total_pages_count_string}' and page 2 of '{total_pages_count_string}'
        
        let head = [['ID','Country','Rank','Capital','Name','TelephoneNumber','Email','SomeText']];
        let body = [
          [1,'Denmark',7.526,'Cp','Alex',9876543.210123456789,'alex@example.com','a!£$%^&*()~#¬,.<>?asdfgQWERTY@asdfgh11222333344444'],.
          .
          .
          [23,'Iceland',7.501,'Reykjavík','John',2321,'john@example.com','asdfgQWERTY'],];

        doc.autoTable({ 
            head: head,body: body,tableWidth: 'auto',styles: {
                cellWidth: 'wrap',fontSize: 8
            },columnStyles: {
                ID: {cellWidth: 'auto'},Country: {cellWidth: 'auto'},Rank: {cellWidth: 'auto'}
            },theme: 'striped',pageBreak: 'auto',showHead: 'everyPage',showFoot: 'everyPage',margin: { top: 30 },didDrawPage: function (data) {
                doc.setFontSize(20);
                doc.setTextColor(40);
                //doc.setFontStyle('normal');
                doc.text("Equipment Out On Jobs",14,22);
                
                doc.setFontSize(20);
                doc.setTextColor(40);
                //doc.setFontStyle('normal');
                doc.text("Job Numbers: 104319419,104319136",30);
                
                // Footer
                var str = "Page " + doc.internal.getCurrentPageInfo().pageNumber;
                // Total page number plugin only available in jspdf v1.0+
                if (typeof doc.putTotalPages === 'function') {
                    str = str + " of " + totalPagesExp;
                }
                
                doc.setFontSize(8);
                doc.setTextColor(40);
                //doc.setFontStyle('normal');
                
                var pageSize = doc.internal.pageSize;
                var pageHeight = pageSize.height ? pageSize.height : pageSize.getHeight();
                doc.text(str,pageHeight - 10);
            },});

        // Total page number plugin only available in jspdf v1.0+
        if (typeof doc.putTotalPages === 'function') {
            doc.putTotalPages(totalPagesExp);
        }

        doc.save('table.pdf');
    }

整个页面都扭曲了。

请帮忙。

UPDATE codepen 在那里它工作得很好。只有在 LWC 中,才会出现问题。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?