首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >如何设置使用jsPDF生成pdf的列宽

如何设置使用jsPDF生成pdf的列宽
EN

Stack Overflow用户
提问于 2014-04-14 12:50:36
回答 1查看 64.2K关注 0票数 8

在过去的两天里,我受到了打击,设置了一个使用jsPDF生成PDF的列宽度。

我是,可以从html表中使用jsPDF库生成pdf,但是我遇到了重叠列的问题。因为我想在工作表中显示20列。我已经将选项纵向改为横向,并在导出脚本选项和html表宽度时设置了宽度5000。

请帮助我,从jsPDF设置pdf列宽度。谢谢

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2014-04-30 10:10:34

4天前我也遇到了同样的问题,并且能够解决它。我提供了下面的示例代码供您理解。

我假设需求是将一个html表(下面提到为table1,它有3行或更多行)导出为PDF格式。我们将设置单元格/列宽度以及这些3+行的字体和字体类型。

第一行将是标题--因此采用粗体.我为第二行和第三行应用了不同的样式,以理解可用的样式。如果您想为每个列应用不同的列宽-您也可以这样做。

希望下面的代码是可读的和自我解释的。如果你有什么问题请告诉我

代码语言:javascript
复制
 $(document).on("click", "#btnExportToPDF", function () { 

        var table1 = 
        tableToJson($('#table1').get(0)),
        cellWidth = 35,
        rowCount = 0,
        cellContents,
        leftMargin = 2,
        topMargin = 12,
        topMarginTable = 55,
        headerRowHeight = 13,
        rowHeight = 9,

         l = {
         orientation: 'l',
         unit: 'mm',
         format: 'a3',
         compress: true,
         fontSize: 8,
         lineHeight: 1,
         autoSize: false,
         printHeaders: true
     };

    var doc = new jsPDF(l, '', '', '');

    doc.setProperties({
        title: 'Test PDF Document',
        subject: 'This is the subject',
        author: 'author',
        keywords: 'generated, javascript, web 2.0, ajax',
        creator: 'author'
    });

    doc.cellInitialize();

   $.each(table1, function (i, row)
    {

        rowCount++;

        $.each(row, function (j, cellContent) {

            if (rowCount == 1) {
                doc.margins = 1;
                doc.setFont("helvetica");
                doc.setFontType("bold");
                doc.setFontSize(9);

                doc.cell(leftMargin, topMargin, cellWidth, headerRowHeight, cellContent, i)
            }
            else if (rowCount == 2) {
                doc.margins = 1;
                doc.setFont("times ");
                doc.setFontType("italic");  // or for normal font type use ------ doc.setFontType("normal");
                doc.setFontSize(8);                    

                doc.cell(leftMargin, topMargin, cellWidth, rowHeight, cellContent, i); 
            }
            else {

                doc.margins = 1;
                doc.setFont("courier ");
                doc.setFontType("bolditalic ");
                doc.setFontSize(6.5);                    

                doc.cell(leftMargin, topMargin, cellWidth, rowHeight, cellContent, i);  // 1st=left margin    2nd parameter=top margin,     3rd=row cell width      4th=Row height
            }
        })
    })

doc.save('sample Report.pdf');  })




function tableToJson(table) {
var data = [];

// first row needs to be headers
var headers = [];
for (var i=0; i<table.rows[0].cells.length; i++) {
    headers[i] = table.rows[0].cells[i].innerHTML.toLowerCase().replace(/ /gi,'');
}

// go through cells
for (var i=1; i<table.rows.length; i++) {

    var tableRow = table.rows[i];
    var rowData = {};

    for (var j=0; j<tableRow.cells.length; j++) {

        rowData[ headers[j] ] = tableRow.cells[j].innerHTML;

    }

    data.push(rowData);
}       

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

https://stackoverflow.com/questions/23060563

复制
相关文章

相似问题

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