JSPDF 中文亂碼


引用自 https://www.hangge.com/blog/cache/detail_2207.html

1,問題描述

(1)如果添加的文字中包含有中文(漢字),我們會發現生成的 pdf 文件時,里面中文部分就會變成亂碼:
原文:JS - PDF文件生成庫jsPDF使用詳解3(解決中文亂碼問題)
(2)這是由於 jsPDF 默認是不支持中文的。我們可以通過手動引入中文字體,解決了導出 pdf 后中文字體顯示亂碼的問題。
 

2,操作步驟

(1)首先訪問下方地址,將 jsPDF-CustomFonts-support 這個 jsPDF 的字體擴展庫以及字體下載到本地,並放到項目文件夾中:
 
(2)接着將 jspdf.customfonts.min.js 和 default_vfs.js 這兩個 js 引入進來。
1
2
< script  src = "jspdf.customfonts.min.js" ></ script >
< script  src = "default_vfs.js" ></ script >
 
(3)最后在代碼中將中文字體添加並設置使用即可。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<!DOCTYPE html>
<html>
   <head>
     <meta charset= "utf-8" >
     <title></title>
     <script src= "jspdf.min.js"  charset= "utf-8" ></script>
     <script src= "jspdf.customfonts.min.js" ></script>
     <script src= "default_vfs.js" ></script>
     <script type= "text/javascript" >
       //頁面初始化
       function  init() {
         var  doc =  new  jsPDF();
         //添加並設置字體
         doc.addFont( 'NotoSansCJKtc-Regular.ttf' 'NotoSansCJKtc' 'normal' );
         doc.setFont( 'NotoSansCJKtc' );
         doc.text(20, 20,  '歡迎訪問 hangge.com' );
         doc.save( 'Test.pdf' );
       }
     </script>
   </head>
   <body onload= "init()" >
   </body>
</html>


原文出自:www.hangge.com  轉載請保留原文鏈接:https://www.hangge.com/blog/cache/detail_2207.html


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM