javascript - jsPDF - 来自 HTML 和自定义字体

Question

我正在使用带有 fromHtml 插件的 jsPDF 库从 HTML 内容生成 pdf 文档，它运行良好。

现在我也在尝试用这个插件添加自定义字体: https://github.com/sphilee/jsPDF-CustomFonts-support

但是，这两个插件似乎不能很好地相互交互，当我生成 pdf 时它会切换到标准字体。

当我单独使用自定义字体插件时，它可以工作。

这是我的代码:

    var pdf = new jsPDF('p', 'pt', 'letter');
    pdf.addFileToVFS('CustomFont.tff', 'base64 of .tff file');
    pdf.addFont('CustomFont.tff', 'CustomFont', 'normal');
    pdf.setFont('CustomFont');
    var source = $('#pdf')[0];
    var margins = {
        top: 50,
        bottom: 60,
        left: 40,
        width: 520
    };
    pdf.fromHTML(
        source,
        margins.left,
        margins.top, {
            'width': margins.width, 
            'elementHandlers': specialElementHandlers
        },
        function (dispose) {
            pdf.save('Test.pdf');
        }, margins);

Answer 1

我今天也遇到了这个问题。原来 jsPDF 内置了对自定义字体的支持。因此，您不再需要包含 jspdf.customfonts.js。

你仍然可以使用jspdf-customfonts来生成default_vfs.js文件:

(function (jsPDFAPI) { 
"use strict";
jsPDFAPI.addFileToVFS('somefont.ttf','AAEAAA...');
})(jsPDF.API);

然后在您的代码中，您可以使用以下代码使用该字体:

pdf.addFont('somefont.ttf', 'somefont', 'normal');
pdf.setFont('somefont');

default_vfs.js生成说明:

1. 在 node_modules\jspdf-customfonts 目录中运行 npm install
2. 将您的字体复制到 fonts 子目录中。
3. 运行 node makeFonts.js 来创建 default_vfs.js。