首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >jsPDF-AutoTable中的Rowspan问题

jsPDF-AutoTable中的Rowspan问题
EN

Stack Overflow用户
提问于 2019-04-07 02:05:10
回答 1查看 730关注 0票数 2

我正在使用的jsPDF-AutoTable插件使pdf从超文本标记语言表格。但是rowspan没有正确显示,请看这里jsfiddle的link

下面是JS:

代码语言:javascript
复制
function htmlToPdf(autoTableId='', fileName = '', headerHtmlId = '', footerHtmlId='', otherHtmlId = '' ) {
    //let doc = new jsPDF();
    let doc = new jsPDF('p', 'pt', 'a4', true);  //pt = px * .75

    let table = autoTableId ? ($("#"+autoTableId).get(0)) : document.getElementById("autoTableId");
    let newFileName = fileName ? (fileName + '.pdf') : 'report.pdf';
    let headerHtml = headerHtmlId ? ($("#"+headerHtmlId).get(0)) : document.getElementById("headerHtmlId");
    let footerHtml = footerHtmlId ? ($("#"+footerHtmlId).get(0)) : document.getElementById("footerHtmlId");
    let otherHtml = otherHtmlId ? ($("#"+otherHtmlId).get(0)) : document.getElementById("otherHtmlId");

    let startY = 30;
    let finalY = doc.previousAutoTable.finalY;
    let pageNumber = doc.internal.getNumberOfPages();
    doc.setPage(pageNumber);
    let totalPagesExp = "{total_pages_count_string}";

    // Document default options
    doc.autoTableSetDefaults({
        //headStyles: {fillColor: [155, 89, 182]}, // Purple, fillColor: 0
        //margin: {top: 25},
    });

    // Document margin list
    let margins = {mTop: 10, mBottom: 60, mLeft: 50, pTop: 10, pBottom: 60, pLeft: 50, width: 800};

    // Skip elements instead of display: none
    let specialElementHandlers = {
        '#skipText': function (element,renderer) {
            return true;
        }
    };

    // Other content options
    let otherContentOptions = {
        'width': margins.width, //max width of content on PDF
        'elementHandlers': specialElementHandlers,
        'pagesplit': true,
    };

    // Header content options
    let header = function(data) {
        doc.setFontSize(18);
        doc.setTextColor(40);
        doc.setFontStyle('normal');
        //doc.addImage(headerImgData, 'JPEG', data.settings.margin.left, 20, 50, 50);
        /*if (base64Img) {
            doc.addImage(base64Img, 'JPEG', data.settings.margin.left, 15, 10, 10);
        }*/

        //let headerHtml = '<header>Hello Header</header>';
        //doc.text(headerHtml, data.settings.margin.left + 15, 22);
        doc.fromHTML(
            headerHtml,
            margins.mLeft, //x coord
            margins.mTop, //y coord
            otherContentOptions, //options object
            margins
        );
    };

    // Footer content options
    let footer = function(data) {
        let str = "Page " + doc.internal.getNumberOfPages();
        // Total page number plugin only available in jspdf v1.0+
        if (typeof doc.putTotalPages === 'function') {
            str = str + " of " + totalPagesExp;
        }
        doc.setFontSize(10);

        // jsPDF 1.4+ uses getWidth, <1.4 uses .width
        let pageSize = doc.internal.pageSize;
        let pageHeight = pageSize.height ? pageSize.height : pageSize.getHeight();
        doc.text(str, data.settings.margin.left, pageHeight - 10);
    };

    // Auto table content options
    let autoTableOptions = {
        html: table,
        startY: startY, //false
        //margin: {top: 30},
        theme: 'plain', //striped, plain, grid
        cellWidth: 'auto',
        useCss: true,
        //tableWidth: 'wrap',
        margin: {bottom:20},
        tableLineWidth: .75,
        tableLineColor: [0, 0, 0],
        styles: {
            fontSize: 10.5, //14px
            font: 'helvetica', //helvetica, times, courier
            lineColor: [0, 0, 0], //or single value ie. lineColor: 255,
            lineWidth: .75, //1px
            cellPadding: 1.5,
            textColor: [0, 0, 0],
            fillColor: [255, 255, 255], //false for transparent or number or array of number
            valign: 'middle', //top, middle, bottom
            halign: 'left', //left, center, right
            cellWidth: 'auto', //'auto', 'wrap' or a number
            overflow: 'ellipsize', //visible, hidden, ellipsize or linebreak
            fontStyle: 'normal', //normal, bold, italic, bolditalic
        },

        // Header & Footer
        didDrawPage: function (data) {
            // Header Content
            header(data);

            // Footer Content
            footer(data);
        },

    };

    // Auto table content
    doc.autoTable(autoTableOptions);

    // Total page number
    if (typeof doc.putTotalPages === 'function') {
        doc.putTotalPages(totalPagesExp);
    }


    // Output
    //doc.save(newFileName);
    doc.output("dataurlnewwindow");
}

上面的功能是使pdf从超文本标记语言表格和超文本标记语言是在这个jsfiddle

这是一个截图:

有谁可以帮我?

如果问题不清楚,请提前给我提建议和感谢。

EN

回答 1

Stack Overflow用户

发布于 2019-08-14 17:11:33

更新到最新版本,应该修复此问题。如果没有,您可以在github存储库中创建一个新问题。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/55551964

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档