首页 > 解决方案 > 如何在jspdf中使用粗体自定义字体

问题描述

我正在尝试使用带有jspdf的自定义字体,但我无法将字体显示为粗体,我按照此处指定的步骤操作。

这是代码:

require ("./js/Roboto-Regular-normal.js");
require ("./js/Roboto-Regular-bold.js");
let doc = new jsPDF();
   
doc.setFont('Roboto-Regular');
doc.setFontSize(8);
doc.text("hello world", 50 , 50);
doc.setFontType('bold');
doc.text("Hello Bold", 50, 55);

let blob = doc.output();
const fs = require('fs');
fs.writeFile('a5.pdf', blob, 'utf8', function(err){
    //Do something
});

Roboto-Regular-normal.js

(function (jsPDFAPI) {
    var font = base64_font; //I didn't include this string because is too large, let me know if I should include it anyways
    
    var callAddFont = function () {
        this.addFileToVFS("Roboto-Regular-normal.ttf", font);
        this.addFont("Roboto-Regular-normal.ttf", "Roboto-Regular", "normal");
    };
    jsPDFAPI.events.push(['addFonts', callAddFont])
})(jsPDF.API);

Roboto-Regular-bold.js:

(function (jsPDFAPI) {
        var font = base64_font; //I didn't include this string because is too large, let me know if I should include it anyways
        
        var callAddFont = function () {
            this.addFileToVFS("Roboto-Regular-bold.ttf", font);
            this.addFont("Roboto-Regular-bold.ttf", "Roboto-Regular", "bold");
        };
        jsPDFAPI.events.push(['addFonts', callAddFont])
})(jsPDF.API)

pdf 中的任何内容都不会显示为粗体。

我在电子中使用它,我不知道这是否会改变任何东西。

标签: jspdf

解决方案


你可以像这样编辑你的JS文件,

doc.text("This is example paragraph", 11,13,).setFontSize(8).setFont(undefined, 'bold');

doc.text("This is example paragraph", 11,13,).setFontSize(8).setFont(undefined, 'normal');

在这里输出, 结果输出


推荐阅读