Question

我正在使用jspdf自动表格插件（jspdf.plugin.autotable.js和jspdf.min.js）在PDF文档中制作表格网格视图。这是我的代码在下面：

var listpaket2 = '<?php echo json_encode($new_array_list_paket_min_15_persen); ?>'
var columns = ["Nama Balai","Kode Satker","Kode PPK","Nama "];
var rows = jQuery.parseJSON(listpaket2); //listpaket2 contain dynamic big data it is about 5000 rows of record
doc.autoTable(columns, rows, {
styles: {fillColor: [100, 255, 255]},
columnStyles: {
id: {fillColor: 255}
 },
 addPageContent: function(data) {
 }
});
alert(doc.height)

当我做alert(doc.height)时，我得到了“未定义”。那不是我的期望。表格中包含大数据时如何检测表格高度？

Answer 1

每次绘制单元格时，您都可以使用提供的hooks来设置新的表格高度，如下所示：

var height = 0;
doc.autoTable(columns, rows, {
    styles: {fillColor: [100, 255, 255]},
    columnStyles: {
        id: {fillColor: 255}
    },
    addPageContent: function(data) {},
    createdCell: function (cell, data) {
        height = data.table.height
    }
});
alert(height)

现在，上述实现可以在v2.3.5上运行，v3仅在4天前（在撰写本文时）已预发布，然后该钩子将被删除。目前看来您可以像这样使用新的钩子：didParseCell：

var height = 0;
doc.autoTable(columns, rows, {
    styles: {fillColor: [100, 255, 255]},
    columnStyles: {
        id: {fillColor: 255}
    },
    didParseCell: function (HookData) {
        height = HookData.table.height
    }
});
alert(height)

请注意，addPageContent也将在v3中删除。其他情况可能仍然会发生变化，如果您决定升级，请检查您的实施。

Answer 2

尝试在 didParseCell 钩子内设置高度不起作用。您可以从该挂钩捕获数据并在表格完成后获取高度。

let height = 0;
let tableMeta = null;

doc.autoTable(columns, rows, {
    styles: {fillColor: [100, 255, 255]},
    columnStyles: {
        id: {fillColor: 255}
    },
    didParseCell: (data) => {
        if (!tableMeta) {
            tableMeta = data.table;
            height = data.table.height; // <- doesn't work, sets height to 0
        }
    }
});

// Calculate the table height
height = tableMeta.finalY - tableMeta.pageStartY;

// Or the final Y position after drawing the table if that's what you need
height = tableMeta.height;

alert(height);

如何检测高度jsPDF-AutoTable

2 个答案: