jspdf-autotable - jspdf-autotable 插件的自定义字体

Question

有人可以帮忙举个例子来设置自定义字体吗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中的字体没有改变。

任何建议，将不胜感激。

Answer 1

尝试这样的事情。

doc.autoTable(columns, data, {styles: {font: "rotobo"}});

或者

您可以在此处参考有关自定义样式示例的更多信息，并且文档README.md显示了所有样式。

Answer 2

您可以使用

console.log(doc.getFontList());

检查他们支持的字体。他们似乎只支持这些字体：

[快递] [Helvetica] [时代] [ZapfDingbats] [快递]

如果您想在 PDF 文件中显示复选标记，此插件可能不具备执行此操作的功能...

Answer 3

要解决您需要做的问题： 1. 下载 jspdf-autotable ，在本地工作。2. 在 jspdf-autotable 中，有 2 次调用 text(...) 函数，因此您需要添加（在调用 text 函数之前）“setFont”

您需要更改的代码：

jsPDF.API.autoTableText = function (text, x, y, styles) {
styles = styles || {};
var FONT_ROW_RATIO = 1.15;
if (typeof x !== 'number' || typeof y !== 'number') {
    console.error('The x and y parameters are required. Missing for text: ', text);
}
var k = this.internal.scaleFactor;
var fontSize = this.internal.getFontSize() / k;
var splitRegex = /\r\n|\r|\n/g;
var splitText = null;
var lineCount = 1;
if (styles.valign === 'middle' || styles.valign === 'bottom' || styles.halign === 'center' || styles.halign === 'right') {
    splitText = typeof text === 'string' ? text.split(splitRegex) : text;
    lineCount = splitText.length || 1;
}
// Align the top
y += fontSize * (2 - FONT_ROW_RATIO);
if (styles.valign === 'middle')
    y -= (lineCount / 2) * fontSize * FONT_ROW_RATIO;
else if (styles.valign === 'bottom')
    y -= lineCount * fontSize * FONT_ROW_RATIO;
if (styles.halign === 'center' || styles.halign === 'right') {
    var alignSize = fontSize;
    if (styles.halign === 'center')
        alignSize *= 0.5;
    if (lineCount >= 1) {
        for (var iLine = 0; iLine < splitText.length; iLine++) {
            this.text(splitText[iLine], x - this.getStringUnitWidth(splitText[iLine]) * alignSize, y);
            y += fontSize;
        }
        return this;
    }
    x -= this.getStringUnitWidth(text) * alignSize;
}
if (styles.halign === 'justify') {
    this.setFont("frank");   //---> this u need to adding
    this.setFontType("normal");
    this.text(text, x, y, { maxWidth: styles.maxWidth || 100, align: 'justify' });
}
else {
    this.setFont("frank"); //---> this u need to adding
    this.setFontType("normal");
    this.text(text, x, y);
}
return this;

};