Threejs 3D中文字体引入及优化

threejs中需要引入中文字体,官网给出的字体文件都是英文的,想要显示出中文字体需要做转换。
1、在本地电脑找个小点的中文字体文件(C:\Windows\Fonts),我用的是华文行楷
2、然后用字体提取工具提取出要显示的文字。
在线转换:https://www.fontke.com/tool/subfont/
3、将上一步导出的.ttf文件转成json格式
转换工具:http://gero3.github.io/facetype.js/
4、转换生成出json文件用FontLoader导入

new THREE.FontLoader().load('static/three/fonts/STXingkai_Regular.json', function (response) {
             var textGeo = new THREE.TextGeometry('苏州大学', {
                   font: response,
                   size: 28,
                   height: 2,
                   curveSegments: 2,
                   bevelThickness: 1,
                   bevelSize: 1.5,
                   bevelEnabled: true
              })

              textGeo.computeBoundingBox();
              textGeo.computeVertexNormals();

              var pointsMaterial = new THREE.PointsMaterial({
                    color:0xffffff,
                    size:80
               })

               textGeo = new THREE.BufferGeometry().fromGeometry(textGeo);

               var textMesh1 = new THREE.Mesh(textGeo, pointsMaterial);

               textMesh1.position.x = -225;
               textMesh1.position.y = 240;
               textMesh1.position.z = 650;
               textMesh1.castShadow = true;
               group.add(textMesh1);
    })                                  

你可能感兴趣的:(Threejs 3D中文字体引入及优化)