TableExport pdf导出中文乱码

** TableExport pdf导出中文乱码方法**
毫无疑问tableExport 是非常强大的,但遗憾的是不支持pdf中文导出,现在要求必须导出pdf格式
虽然我并没感觉到导出pdf的意义何在,excel不就很好。但既然要求了就要做,对不
闲言少叙,下面直接讲解决问题的步骤。
第一步
先去 https://github.com/kayalshri/tableExport.jquery.plugin 把tableExport下载下来
在这里面你会看到test目录下名为pdfmake.html 的文件。这个页面是导出pdf的,但遗憾的是不支持中文导出。
第二步
解决中文导出问题耗费了我很长时间,网上说的解决办法大都不是很清楚,所以走了很多弯路,
大家就不要尝试jsPdf了,因为亲测对导出中文并没啥用。最终发现pdfmake比较好用。
步骤:
a.去https://github.com/bpampuch/pdfmake里把pdfmake 下载下来
b.找到pdfmake-master/examples/fonts目录,然后从网上下载微软雅黑.ttf格式的字体,网上有很多,随便下一个就可以。下好之后拷贝到pdfmake-master/examples/fonts目录下
c.难点来了,创建一个新vfs_fonts.js(build目录下)文件,好吧其实也不难,主要是网上的文章在此步骤大都是一点而过。要想生成新的vfs_fonts.js,首先你确保你已安装grunt,如没有请先安装,命令:npm install grunt ,
npm install -g grunt-cli, 然后cd到pdfmake-master/目录,输入npm install 添加依赖   并安装 npm install grunt-dump-dir --save-dev
然后运行命令grunt dump_dir 即可生成新的vfs_fonts.js文件
第三步:
用build目录下新生成的vfs_fonts.js文件替换掉tableExport.jquery.plugin-master\libs\pdfmake的vfs_fonts.js
第四步:找到tableExport.jquery.plugin-master目录下的tableExport.js,替换代码如下:




{% codeblock%}
<script type="text/javascript">
//替换前
var docDefinition = {
                pageOrientation: 'landscape',
                content: [
                    {
                        table: {
                            headerRows: $hrows.length,
                            widths: widths,
                            body: body
                        }
                    }
                ]
            };
//替换后
         pdfMake.fonts = {
                Roboto: {
                    normal: 'Roboto-Regular.ttf',
                    bold: 'Roboto-Medium.ttf',
                    italics: 'Roboto-Italic.ttf',
                    bolditalics: 'Roboto-Italic.ttf'
                },
                微软雅黑: {
                    normal: 'msyh.ttf',
                    bold: 'msyhbd.ttf',
                    italics: 'msyh.ttf',
                    bolditalics: 'msyhbd.ttf'
                }
            };
var docDefinition = {
                pageOrientation: 'landscape',
                content: [
                    {
                        table: {
                            headerRows: $hrows.length,
                            widths: widths,
                            body: body
                        }
                    }
                ],
                defaultStyle: {
                    font: '微软雅黑'
                }
            };
</script>
{%endcodeblock%}


最后再打开pdfmake.html,发现已经支持中文导出。至此大功告成。

如若还不明白可qq,1574697828

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值