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"}});

或

您可以参考自定义样式示例here，文档README.md显示所有样式。

Answer 2

您可以使用

console.log(doc.getFontList());

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

[Courier] [Helvetica] [Times] [ZapfDingbats] [courier]

如果您想在PDF文件中显示复选标记，则此插件可能无法执行此操作...

Answer 3

要解决此问题，您需要执行以下操作： 1.下载jspdf-autotable，以在本地工作。 2.在jspdf-autotable中，有2次调用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;

};

jspdf-autotable插件的自定义字体

3 个答案: