您的位置:首页 > Web前端 > JavaScript

threejs 中文字体精简方法

2018-01-22 13:47 1476 查看
threejs中需要显示中文字体,这就意味着需要引入中文字体,引入方式这里介绍两种,一种是引擎默认的ttf字体文件转换成json格式然后再使用FontLoader,这种方式目前存在各种问题,第一是ttf转json格式原本2M的ttf字体转后到7-8M,对于网页来说基本没什么用处了,再一个服务器一旦开启gzip就无法获取json格式的content-length,所以加载进度条也没法用了。这里重点介绍TTFLoader直接加载ttf字体文件,这样不存在格式转化问题,不说文件多小么至少没大起来,重点来了,python有一个FontTools字体精简工具,可以生成所需字体的文件,拿我的来说从json
8M的使用TTFLoader缩到2M,加上gzip就更小,再使用FontTools生成字体就只有几10K了,没错,就是10K
下面具体讲下搭配使用FontTools安装和使用过程
首先安装python环境,这个就不再多说了
接下来就是安装FontTools,下载地址https://github.com/behdad/fonttools/releases
安装也非常简单,直接进入目录执行

$python setup.py build
$python setup.py install
就完成了
FontTools有针对字体个各式各样的操作,教程,这里只说我们需要的那个功能
$pyftsubset font.otf --text=" 汉字 "--text选项用于指定需要保留的字符
--text-file选项用于指定一个包含需要保留的字符的 txt 文档
--output-file选项用于指定输出文件的保存位置
eg:pyftsubset msyh.ttf --text="汉字" --output-file msyh_sub.ttf 就生成了
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: