Three.js使用THREE.TextGeometry创建三维文本中文乱码的问题如何解决？

three.js使用three.textgeometry创建三维文本中文乱码的问题如何解决？

解决方案

如果写汉字发现出来的只是一堆？？？？的话，证明当前引入的字体不支持汉字。我们的解决方案就是引入可以支持汉字json文件。那么问题来了，这种json文件我们怎么获得？

- 我们可以使用ttf格式的文件进行转换即可，有一个地址，可以进行在线转换https://gero3.github.io/facetype.js/，在当前地址可以转换出来json格式的文件。

- 然后再按照上一节的方法，异步引入文件即可

                //创建loader进行字体加载，供后面的模型使用
                var loader = new three.fontloader();
                loader.load( 'assets/fonts/microsoftyahei_regular.json', function ( response ) {
                    gui.font = response;
                    gui.asgeom();
                } );

然后书写汉字，就不会出现乱码情况了

            asgeom: function () {
                // 删除掉原来的旧模型
                scene.remove(text1);
                scene.remove(text2);
                // 重新创建模型
                var options = {
                    size: gui.size,
                    height: gui.height,
                    weight: gui.weight,
                    font: gui.font,
                    bevelthickness: gui.bevelthickness,
                    bevelsize: gui.bevelsize,
                    bevelsegments: gui.bevelsegments,
                    bevelenabled: gui.bevelenabled,
                    curvesegments: gui.curvesegments,
                    steps: gui.steps
                };

                text1 = createmesh(new three.textgeometry("测试汉字", options));
                text1.position.z = -100;
                text1.position.y = 100;
                scene.add(text1);

                text2 = createmesh(new three.textgeometry("three.js", options));
                scene.add(text2);
            }