javascript - 在 jsPdf 中添加 FontAwesome 图标

Question

我正在使用jspdf.debug.js最新版本。 网页中使用的 FontAwesome 图标不会在 pdf 中呈现。 我在页面中添加了一个 FontAwesome 用户图标。请参阅图片。(左侧是 HTML，右侧是 pdf 输出) 下面是我的代码片段。

var pdf = new jsPDF('p', 'pt', 'letter');
pdf.addFont('FontAwesome', 'FontAwesome', 'normal');
pdf.setFont('FontAwesome');
pdf.canvas.height = 72 * 11;
pdf.canvas.width = 72 * 8.5;
html2pdf(document.body, pdf, function(pdf){
    var iframe = document.createElement('iframe');
    iframe.setAttribute('style','position:absolute;right:0; top:0; bottom:0; height:100%; width:500px');
    document.body.appendChild(iframe);
    iframe.src = pdf.output('datauristring');
});

Answer 1

我就是这样做的，并且所有字体都适用于 Awesome 5...

1. 正在关注 this article我将 fa-solid-900-normal.ttf 上传至 https://peckconsulting.s3.amazonaws.com/fontconverter/fontconverter.html

2. 我获取了js文件并导入它。

3. 在 Angular 中我是这样做的

    constructor() {
    var callAddFont = function () {
        this.addFileToVFS('fa-solid-900-normal.ttf', jsPDFfonts.fontawesome5_fa_solid_900);
        this.addFont('fa-solid-900-normal.ttf', 'fa-solid-900', 'normal');
    };
    jsPDF.API.events.push(['addFonts', callAddFont])
   

   }

其中 jsPDFfonts.fontawesome5_fa_solid_900 是文件的内容

然后在打印图标的打印过程中我就这样做了

     pdf.setFont('fa-solid-900', 'normal');
     pdf.setFontSize(10);
     pdf.text('\uf6f0', 15, 15*index);

我直接打印了图标的unicode