Question

您好我使用JSPDF通过创建单元格手动生成PDF。

我必须指定单元格的高度，但是当文本的大小更大时，它会超过单元格。我怎么能避免这种情况。

enter image description here

这是我的代码：

           var l = {
                    orientation: 'l',
                    unit: 'mm',
                    format: 'a4',
                    compress: true,
                    fontSize: 8,
                    lineHeight: 1,
                    autoSize: false,
                    printHeaders: true
                }, pdf = new jsPDF(l, '', '', ''), i, j, margins = {
                    top: 30,
                    bottom: 10,
                    left: 10,
                    width: 25
                };

                //initializing the cells
                pdf.cellInitialize();

                var lines = pdf.splitTextToSize(' This is large icon to f', 12);
                pdf.cell(margins.left, margins.top, 14, 8, lines, 0);

                pdf.save('Te.pdf');

现在我可以增加细胞的高度，但文本仍然会超过细胞。

这是它的样子。

enter image description here

任何人都可以帮助我。我正在使用JSPDF https://github.com/MrRio/jsPDF

Answer 1

你必须使用JSPDF吗？

您可以轻松地在pdfmake（http://pdfmake.org）中实现所需。

虽然哲学有点不同 - pdfmake是一个自动计算布局的声明性库。

基本表定义如下所示：

var docDefinition = {
  content: [
    {
      table: {
        // header rows are automatically repeated if the table spans over multiple pages
        // you can declare how many rows should be treated as headers
        headerRows: 1,
        widths: [ '*', 'auto', 100, '*' ],

        body: [
          [ 'First', 'Second', 'Third', 'The last one' ],
          [ 'Value 1', 'Value 2', 'Value 3', 'Value 4' ],
          [ { text: 'Bold value', bold: true }, 'Val 2', 'Val 3', 'Val 4' ]
        ]
      }
    }
  ]
};

还支持col / row跨度，不可破坏的行（如果当前页面上没有足够的空间），自动调整大小，固定大小和星号大小的列。

您可以查看pdfmake playground

中的表格示例

Answer 2

我遇到了同样的问题。

但是如果你看看jspdf.plugin.cell.js，它实际上是在绘制一个包裹文本的矩形。换句话说，单元格本身就是一个矩形。

里面的 jsPDFAPI.cell()函数， this.text(txt, x + 3, y + h - 3);，此行实际上控制文本将出现在每个单元格的一侧。

您可以这样做： this.text(txt, x + 3, y + h/2 - 3);，然后文本将以单元格为中心。

希望这有帮助。

如何在JSPDF的单元格中居中放置文本

2 个答案: