Three.js显示中文字体

来源：互联网发布：xp如何安装网络打印机编辑：程序博客网时间：2024/05/20 10:24

在Three.js的场景中用的不是英文字体会显示乱码，显示中文字体的解决办法如下：

思路：将ttf 字体格式转换成 js 文件格式，再将js引入，便能显示了~

所用工具：facetype.js-gh-pages （ https://github.com/gero3/facetype.js.git 下载到本地）

（http://gero3.github.io/facetype.js/ 远程访问地址）

工具使用方法：将“facetype.js-gh-pages”这个放在本地服务器上跑起来，用浏览器打开页面，选择ttf文件上传，它自动转成js并下载到本地浏览器默认下载路径中。

注意事项：

1.将生成的js文字库打开，搜索“name”，将中文替换成英文全小写“helvetiker”（名字自拟）

2.如果转换过程中页面未响应或没有弹出转换后保存提示框，有可能是ttf文件比较大出错了，建议下载一个文件小一点的转换！！！！

引用js字体：<script type="text/javascript" src="js/helvetiker_regular.typeface.js"></script>

给字体附上属性：


          var options = {                size: 10,                height: 0,                weight: 'normal',                font: 'helvetiker',“引用js字体必须换成英文”                style: 'normal',                bevelThickness: 1,                bevelSize: 1,                bevelSegments: 1,                curveSegments: 50,                steps: 1           };           scene.add(new THREE.Mesh(                new THREE.TextGeometry("hello",options),                new THREE.MeshBasicMaterial({color:0xcccccc})                ))

这样就能引入中文字体了 ^_^

0 0