Trung tâm cá nhân
sách gpt4 ai đã đi

javascript - pdfmake - 使用自己的字体不起作用

In lại 作者：行者123 更新时间：2023-11-29 10:33:40 26 4
mua khóa gpt4 Nike

我正在使用 pdfmake 在客户端创建 PDF。我们有一个所见即所得的编辑器，允许用户创建 pdf。然后将其解析以与 pdfmake 一起使用。

但是，我无法使用普通字体。该插件使用 vfs_fonts.js 在 PDF 上创建字体，默认为 Roboto。

我正在尝试让它与 Times New Roman 等类似的网站一起工作。

我试过这样修改文件:

window.pdfMake = window.pdfMake || {};
window.pdfMake.vfs = {
  Roboto: {
		"Roboto-Italic.ttf": "BASE 64 HERE",
        "Roboto-Medium.ttf": "BASE 64 HERE",
        "Roboto-Regular.ttf": "BASE 64 HERE"
  },
  TimesNewRoman: {
        "Roboto-Italic.ttf": "BASE 64 HERE",
        "Roboto-Medium.ttf": "BASE 64 HERE",
        "Roboto-Regular.ttf": "BASE 64 HERE"
  }
}

我已经使用与 Roboto 相同的字体进行测试，但它仍然不起作用。这是我返回的错误

Uncaught Error: No unicode cmap for font

下面是我的代码。您将此字符串粘贴到 pdf tester here 中并查看结果 

{  
   "content":[  
      {  
         "stack":[  
            {  
               "text":[  
                  {  
                     "text":""
                  }
               ]
            },
            {  
               "text":"ygjjkjgjkhjkjghk",
               "style":"style_2",
               "lineHeight":"1"
            }
         ],
         "style":"style_1"
      },
      {  
         "stack":[  
            {  
               "text":[  
                  {  
                     "text":""
                  }
               ]
            },
            {  
               "text":" ",
               "style":"style_4",
               "lineHeight":"1"
            }
         ],
         "style":"style_3"
      },
      {  
         "stack":[  
            {  
               "text":[  
                  {  
                     "text":""
                  }
               ]
            },
            {  
               "text":"",
               "style":"style_7",
               "font":"TimesNewRoman",
               "lineHeight":"1"
            },
            {  
               "text":"sdfghfdghfghdgfgfh",
               "style":"style_8",
               "font":"TimesNewRoman",
               "lineHeight":"1"
            }
         ],
         "style":"style_5"
      }
   ],
   "styles":{  
      "style_1":{  
         "opacity":"1"
      },
      "style_2":{  
         "opacity":"1"
      },
      "style_3":{  
         "opacity":"1"
      },
      "style_4":{  
         "opacity":"1"
      },
      "style_5":{  
         "opacity":"1"
      },
      "style_6":{  
         "opacity":"1"
      },
      "style_7":{  
         "font":"TimesNewRoman",
         "opacity":"1"
      },
      "style_8":{  
         "opacity":"1"
      }
   },
   "pageSize":"A4",
   "pageOrientation":"portrait",
   "pageMargins":[  
      40,
      20,
      40,
      20
   ]
}

还有其他人用过这个库吗？如果是这样，您是否使用了自定义字体，您是如何让它们工作的？如果需要我可以发布更多代码，谢谢

1 Câu trả lời

关于如何在客户端使用自定义字体的 Pdfmake 文档 đây .

vfs_fonts.js 文件格式类似于:

this.pdfMake = this.pdfMake || {}; this.pdfMake.vfs = {
  "Roboto-Italic.ttf": "AAEAAAASAQAABAAgR0RFRtRX1"
}

因此，你应该像下面这样定义它:

window.pdfMake.vfs["Times-New-Roman-Regular.ttf"] = "BASE 64 HERE";
window.pdfMake.vfs["Times-New-Roman-Medium.ttf"] = "BASE 64 HERE";
window.pdfMake.vfs["Times-New-Roman-Italic.ttf"] = "BASE 64 HERE";

之后还需要给pdfMake.fonts赋值:

pdfMake.fonts = {
    // Default font should still be available
    Roboto: {
        normal: 'Roboto-Regular.ttf',
        bold: 'Roboto-Medium.ttf',
        italics: 'Roboto-Italic.ttf',
        bolditalics: 'Roboto-Italic.ttf'
    },
    // Make sure you define all 4 components - normal, bold, italics, bolditalics - (even if they all point to the same font file)
    TimesNewRoman: {
        normal: 'Times-New-Roman-Regular.ttf',
        bold: 'Times-New-Roman-Bold.ttf',
        italics: 'Times-New-Roman-Italics.ttf',
        bolditalics: 'Times-New-Roman-Italics.ttf'
    }
};

然后，您可以像现在一样在您的 pdf 定义中同时使用 Robot Và TimesNewRoman 作为字体:

{  
   content:[  
      {  
         text: 'some text using Roboto font'
         style: 'style_1'
      },
      {  
         text: 'some text using Times New Roman font'
         font: 'TimesNewRoman'
      }
   ],
   styles:{  
      style_1:{  
         opacity: '1',
         font: 'Roboto'
      }
   }
}

关于javascript - pdfmake - 使用自己的字体不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/40656655/

26 4 0
Bài viết được đề xuất: ios - MKMapView 或 CLLocationManger - 确定用户的当前位置
Bài viết được đề xuất: javascript - 将多维输入转换为 JavaScript 对象
Bài viết được đề xuất: javascript - 从缺少属性的 indexedDB 对象存储中删除对象的有效方法
Bài viết được đề xuất: javascript - 有序尺度行为
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Các bài viết nóng hổi trên toàn bộ trang web
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com