标签: jspdf-autotable

我的桌子有13列.如何为每列获得不同的宽度？我可以像这样给每列宽度吗？

styles:{overflow:'linebreak',columnWidth:[100,80,80,70,80,80,70,70,70,70,60,80,100]},

我的表语法:

> var res = doc.autoTableHtmlToJson(document.getElementById(tableID)); 
> doc.autoTable(res.columns, res.data, {  styles: {overflow: 'linebreak'
> ,columnWidth: [100,80,80,70,80,80,70,70,70,70,60,80,100]},  startY:
> 60,  bodyStyles: {valign: 'top'},  });

我正在尝试制作一个合并了2个标头的表.目前我制作了2个单独的表,有2个单独的标题,看起来没问题,但是当表格宽度扩大时,第一个表格标题不会展开.我如何合并2个标题,或者我可以制作1个表与2个表头.请看图片(目前桌面如何与2个桌面阅读器)

这是我的代码:

function createPDF(){
             /** START PDF INSTANCE */
            //var doc = new jsPDF('p', 'pt');
            var doc = new jsPDF('l', 'pt');
            var row = 80;
            addPdfHeader(doc, row, vm.translate("REPORT.LEGALFORMS ")+" "+vm.activeCompanyYear);

            doc.setFillColor(33, 150, 243); 
            var columns = [ "               ",vm.activeCompanyYear,vm.activeCompanyYear-1,vm.activeCompanyYear-2];

            var rows = [];

            var description = "";
            for(var j=0; j<vm.reportData.length; j++){
                var obj = vm.reportData[j];


                description = obj.descriptionEng;

                if(description == "total"){
                    description = vm.translate("REPORT.REGISTRY.TOTAL");
                } 

                var singleRow = [description,
                                 obj.year3Total,
                                 obj.year3Local,
                                 obj.year3International,
                                 obj.year2Total,
                                 obj.year2Local,
                                 obj.year2International,  
                                 obj.year1Total,
                                 obj.year1Local,
                                 obj.year1International
                               ]
               rows.push(singleRow); …

我在我的网站中使用带有 AutoTable 的 jsPDF，当我将表格导出为 PDF 时出现问题。

当 PDF 在列中的字符串中包含 'd' 字母时，在 'd' jsPDF 之后将通过断开单词并使 PDF 不可读来设置换行符。

还有其他情况，即使是数字“2”等其他字符。

有办法解决吗？

这是导出时的样子：

虽然文本中断是：

antipasto con gnocco patate  + spergola
bimbi verdi + tagliatella ragù
tortello verde + riso
misto carni arrosto con patate e padleda
Alessandra cioccolatina con smarties

我制作 jsPDF 的函数如下所示：

function PDF(id, stat) {
    var doc = new jsPDF('l', 'pt', 'a4', true);
    var table = '#' + id;
    var text = 'Prenotazioni del ' + moment($("#day").attr('data-giorno')).format('DD MMMM YYYY');

    doc.setFontSize(18);
    doc.text($('#titlepdf').val(), 14, …

我在Angular应用程序上使用JSPdf,我正在尝试使用JS autotable插件,但我遇到了JS错误

EXCEPTION:未捕获(承诺):TypeError:doc.autoTable不是函数

TypeError:doc.autoTable不是函数

我通过npm安装了jspdf和jspdf-autotable,我确认它们在节点模块中.

我用这种方式导入了两个插件:

import * as jsPDF from 'jspdf' 
import * as autoTable from 'jspdf-autotable'

这是我的代码:

private renderPdf():void{
    let testcolumns = ["TestCol1", "TestCol2"];
    let testrows = [["test item 1", "test item 2"]];
    let doc = new jsPDF();
    doc.autoTable(testcolumns, testrows);
    doc.save('sample.pdf');
}

我可以在这里找到什么或者我可以提供更多代码来帮助确定问题吗？

谢谢!

我的例子（只需单击“导出 PDF”）：https : //jsfiddle.net/j9vaqpnz/7/

我的示例导出我的表，如下所示：

.

然后使用库jspdf和autotable将表导出为 pdf 。

在导出函数期间，我使用“drawCell”函数，对于包含数字的所有列，我将它们右对齐如下：

drawCell: function (cell, data) {
                var col = data.column.index;
                if(col==3 || col==5 || col==6 || col==7 || col==8 || col==9 || col==10){
                    cell.styles.halign = 'right';
                }
            }

.

问题：在 PDF 中，我右对齐的所有列都定位不正确，如下所示：

这是一个错误吗？或者我可能不正确地使用“drawCell”？

我正在使用jsPDF自动表从表中获取html内容并在jsPDF文档中显示以进行导出,但无论我尝试什么,似乎无法按照我的意愿获得列宽的打破/包装.

理想情况下,表和列会自动计算其宽度,长列内容包含多行,类似于此处的"long:overflow linebreak"示例:https://simonbengtsson.github.io/jsPDF-AutoTable/#长

虽然我使用的是示例中的相同代码,但它不会以相同的方式生成.

exportGraph = function () {
    var doc = new jsPDF();
    var elem = document.getElementById("basic-table");
    var res = doc.autoTableHtmlToJson(elem);

    doc.autoTable(res.columns, res.data, {
        startY: 15,
        margin: { horizontal: 0 },
        bodyStyles: { valign: 'top' },
        styles: { overflow: 'linebreak', columnWidth: 'wrap' },
        columnStyles: { text: { columnWidth: 'auto' } }
    });

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

jsfiddle的例子

任何帮助将不胜感激,因为现在变得非常令人沮丧!!

我正在为我的表格 pdf 使用 jsPDF AutoTable 插件。

我的资料来源：

#javaScriptIncludeTag("jspdf.min.js")#
#javaScriptIncludeTag("jspdf.plugin.autotable.js")#

我的资料来源来自：

https://github.com/MrRio/jsPDF

https://github.com/simonbengtsson/jsPDF-AutoTable

我的脚本：

$(function() {

    var doc = new jsPDF('p', 'pt', 'a4');
    var $tables2 = $(".pdftable2");
    var startingY = 0;

    $tables2.each(function( index ) {

        var $this = $(this), tableid = $this.attr('id');
        var res = doc.autoTableHtmlToJson(document.getElementById(tableid));
        var offset =  2;
        startingY = doc.autoTableEndPosY() + offset;

        doc.autoTable(res.columns, res.data, {
            startY: startingY,
            pageBreak: 'avoid',
            theme: 'grid',
            styles: {
                overflow: 'linebreak',
                fontSize: 12,
                valign: 'middle'
            },
            columnStyles: {
                0: {valign: "top"}, 
                1: {
                    columnWidth: …

我的任务是使用 JavaScript 将数据打印成 pdf 文件。所以我为我的任务选择了 jsPdf 并且也成功了。我的任务是将该打印任务转换为 TypeScript 。这里我面临一个新问题，Can't find name jsPdf in TypeScript我不知道原因，因为在我的 JavaScript 中成功运行的代码在使用 TypeScript 运行时无法做到这一点。我花了两天的时间来寻找解决方案，但失败了。参考了很多网站，但没有找到任何解决方案。有人可以帮我解决这个问题吗？

索引.html ,

<script src="common/jspdf.min.js"></script>
<script src="common/jspdf.plugin.autotable.js"></script>

我的 Js 文件，

 this.print=function(){
   {
var columns = [" Data","StepData","CateData","CritiData","CheckyData"];
               
      
                var rows = [];
                for (var i = 0 ; i<Data.length; i++) 
                {
                	
                    rows.push([
                        
                        Data[i],
                        StepData[i],
                        CateData[i],
                        CritiData[i],
                        CheckyData[i]
                        
                    ]);
                };
                
                var pdfsize='b2';
               var doc = new jsPDF('p', 'pt',pdfsize);
     
                doc.autoTable(columns, rows, {
                	theme: 'grid', // 'striped', 'grid' or 'plain'
                	headerStyles: {
                        fillColor: [12, 234, …

有人可以帮忙举个例子来设置自定义字体吗？ jspdf-autotable

我尝试了以下

var doc = new jsPDF('p', 'pt');
doc.setFont("rotobo");      ----> font face name that I declared in my css file
doc.autoTable(columns, data);
doc.save("table.pdf");

在我尝试之后，PDF 中的字体没有改变。

任何建议，将不胜感激。

我对 jsPDF autotable 有疑问。

我的代码：

    $('#printBtn').on('click', function() {
    var pdf = new jsPDF('p', 'pt', 'a4');
    var res = pdf.autoTableHtmlToJson(document.getElementById("tablePrint"));

    pdf.autoTable(res.columns, res.data, {
        theme : 'plain',
        styles: {
            fontSize: 12
        },
        showHeader: 'never',
        createdCell: function(cell, data) {
            var tdElement = cell.raw;
            if (tdElement.classList.contains('hrow')) {
                cell.styles.fontStyle = 'bold';
            }
        }
    });

    pdf.save("test.pdf");
});

我想在 div 的表格之前和之后添加文本。我在 jsPDF 自动表示例中找到了这个代码片段：

    var before = "text before";
    pdf.text(before, 14, 30);

这段代码效果很好。我在 pdf.autoTable(...}); 之前插入了它。但我不知道数字 14 和 30 是什么意思？

然后我在 pdf.autoTable 函数调用之后插入了代码，并且文本打印在 pdf 的最后一页但在页面的顶部，而不是在最后，为什么？

抱歉我的英语不好。感谢帮助。