javascript - 如何在jsPdf表格中设置表格

Question

嗨，我正在使用 jsPdf 将报告导出为 pdf 我的代码在这里

 import { Component, OnInit, AfterViewInit, Inject, ViewChild, ElementRef } from '@angular/core';
import * as jsPDF from 'jspdf';

@Component({
  templateUrl: 'goldenSignature.component.html',
  providers: [UserService,
    { provide: 'Window', useValue: window }
  ],
})

export class GoldenSignatureComponent {  

  download() {
    let type;
    if (this.type) {
      type = this.type;
    }
    else {
      type = this.message.allProducts;
    }
    let columns = ["S.No", "Product Name", "Product Type", "Brand Name", "Model Name", "Sample Size", "Status", "Version Number"];
    let data = [];
    let headers = { "S.No": "S.No", "Product Name": "Product Name", "Product Type": "Product Type", "Brand Name": "Brand Name", "Model Name": "Model Name", "Sample Size": "Sample Size", "Status": "Status", "Version Number": "Version Number" };
    data.push(headers);
    if (type == this.message.allProducts) {
      for (let i = 0, j = 1; i < this.data.length; i++) {
        let data1 = {};
        data1 = { "S.No": j, "Product Name": this.data[i].productName, "Product Type": this.data[i].productType, "Brand Name": this.data[i].brandName, "Model Name": this.data[i].modelName, "Sample Size": this.data[i].sampleSize, "Status": this.data[i].status, "Version Number": this.data[i].versionNo };
        data.push(data1);
        j++;
      }
    }
    else {
      for (let i = 0, j = 1; i < this.data.length; i++) {
        if (type == this.data[i].productName) {
          let data1 = {};
          data1 = { "S.No": j, "Product Name": this.data[i].productName, "Product Type": this.data[i].productType, "Brand Name": this.data[i].brandName, "Model Name": this.data[i].modelName, "Sample Size": this.data[i].sampleSize, "Status": this.data[i].status, "Version Number": this.data[i].versionNo };
          data.push(data1);
          j++;
        }
      }
    }
    var doc = new jsPDF('landscape', 'pt');
    doc.setFontSize(18);
    doc.setTextColor(0, 0, 0);
    doc.text(300, 100, type);
    let styles = {
      autoSize: true,
      printHeaders: false,
      columnWidths: 80
    }
    doc.table(100, 150, data, columns, styles);
    doc.save(this.message.pdfGoldenSignature);
  }   

}

一切正常，问题是我想设置表格和表格列的宽度。请任何人告诉如何设置表格的宽度和表格的其他属性 提前致谢

Answer 1

您必须使用 jsPdf 的不同函数给出合适的边距和填充，以合适的方式表示可能是一项繁琐的任务。

尝试jsPDF-autotable插件效果很好，提供了不同的样式/主题。您可以轻松自定义列和行的高度和宽度。