如何在Three.js中显示汉字

Question

我正在使用OBJLoader加载一个大型3D模型(在.obj文件中描述)，并希望在其表面上显示模型名称。虽然看起来Three.js只能显示英文字符。我的问题是如何在Three.js中显示中文字符？

Answer 1

有几种方法可以显示文本(https://github.com/mrdoob/three.js/wiki/Text-in-Three.js)，但由于导出中文字体可能比较困难，因此将中文字符绘制到画布纹理并将该纹理用作场景中的材质可能会更容易。

Answer 2

似乎你可以使用Facetype.js来获取一个中文字库，比如“YaHei_Regular.typeface.json”，然后你就可以显示汉字了。

var fontLoader = new THREE.FontLoader();
    fontLoader.load("YaHei_Regular.typeface.json", (font)=> {
        this.font = font;
    });

Answer 3

另一种选择是使用msdf-bmfont-xml。此示例使用Microsoft YaHei。

charset.txt -

你好，世界

您可能需要先执行install dependencies。然后：

npm install msdf-bmfont-xml -g
msdf-bmfont -f json yahei.ttf -i charset.txt --pot --square

最后，使用three-bmfont-text呈现文本。