时间戳

首页 > 解决方案 > 关于如何使用一组数据但两行标题导出 PDF 的任何建议？

javascript - 关于如何使用一组数据但两行标题导出 PDF 的任何建议？

问题描述

我有一个问题，到目前为止，我一直在使用带有 autotable 的 jspdf 来创建简单的报告，一行标题，一组数据，效果很好。

我正在使用 Angular 8

但是，我现在有一份报告，其中需要此布局：

Name: Steve    Age: 38    otherTitle: xxx    otherTitle: xxx   otherTitle: xxx
--NEWLINE--
otherTitle: xxx    otherTitle: xxx    otherTitle: xxx    otherTitle: xxx

本质上是两行标题，其右侧是数据。

网页布局很简单，效果很好。但是将其导出为pdf我不知道该怎么做，有什么建议吗？

标签： javascriptangularpdfjspdf

解决方案

好的，所以我对我自己的解决方案并不完全满意，但它现在有点像我想要的，如果其他人需要类似的东西，它不会完全赢得奖品。如果有人有更好的解决方案来使用这样的数据创建 pdf那么请回复;D

*仍然使用jspdf

谢谢大家。

const reportCreationDate = Date.now();
    let doc = new jsPDF('landscape') as jsPDFWithPlugin;
    doc.setFontSize(7);
    printArrayL1.forEach((el, i) => {
      doc.text(5, 10 + (i * 10), `Header: ${el[0]}`);
      doc.text(40, 10 + (i * 10), `Header: ${el[1]}`);
      doc.text(80, 10 + (i * 10), `Header: ${el[2]}`);
      doc.text(120, 10 + (i * 10), `Header: ${el[3]}`);
      doc.text(140, 10 + (i * 10), `Header: ${el[4]}`);
      doc.text(180, 10 + (i * 10), `Header: ${el[5]}`);
      doc.text(210, 10 + (i * 10), `Header: ${el[6]}`);
      doc.text(230, 10 + (i * 10), `Header: ${el[7]}`);
      doc.text(260, 10 + (i * 10), `Header: ${el[8]}`);
    });
    printArrayL2.forEach((el, i) => {

      doc.text(5, 15 + (i * 10), `Header: ${el[0]}`);
      doc.text(40, 15 + (i * 10), `Header: ${el[1]}`);
      doc.text(80, 15 + (i * 10), `Header: ${el[2]}`);
      doc.text(120, 15 + (i * 10), `Header: ${el[3]}`);
      doc.text(140, 15 + (i * 10), `Header: ${el[4]}`);
      doc.text(180, 15 + (i * 10), `Header: ${el[5]}`);
      doc.text(210, 15 + (i * 10), `Header: ${el[6]}`);
      doc.text(230, 15 + (i * 10), `Header: ${el[7]}`);
      doc.text(260, 15 + (i * 10), `Header: ${el[8]}`);
    });

推荐阅读