three.js 创建文字的几种方法

1. DOM + CSS

传统网页html实现

2. 将文字绘制到画布中，并将其用作Texture（纹理）

将文字保存为图片格式，再将其当作一张蒙皮材质，贴到某个物体上

3. 在你所喜欢的3D软件里创建模型，并导出给three.js

建模实现，成本高，效果好

4. three.js自带的文字几何体

构造器

var loader = new THREE.FontLoader();loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {    var geometry = new THREE.TextGeometry( 'Hello three.js!', {        font: font,        size: 80,        height: 5,        curveSegments: 12,        bevelEnabled: true,        bevelThickness: 10,        bevelSize: 8,        bevelSegments: 5    } );} );

TextGeometry(text : String, parameters : Object)

text — 将要显示的文本。

parameters — 包含有下列参数的对象：

font — THREE.Font的实例。

size — Float。字体大小，默认值为100。

height — Float。挤出文本的厚度。默认值为50。

curveSegments — Integer。（表示文本的）曲线上点的数量。默认值为12。

bevelEnabled — Boolean。是否开启斜角，默认为false。

bevelThickness — Float。文本上斜角的深度，默认值为20。

bevelSize — Float。斜角与原始文本轮廓之间的延伸距离。默认值为8。

bevelSegments — Integer。斜角的分段数。默认值为3。

可用的字体

文本几何体使用 typeface.json所生成的字体。一些已有的字体可以在/examples/fonts中找到，且必须在页面中引入。

字体	字重	风格	文件路径
helvetiker	normal	normal	/examples/fonts/helvetiker_regular.typeface.json
helvetiker	bold	normal	/examples/fonts/helvetiker_bold.typeface.json
optimer	normal	normal	/examples/fonts/optimer_regular.typeface.json
optimer	bold	normal	/examples/fonts/optimer_bold.typeface.json
gentilis	normal	normal	/examples/fonts/gentilis_regular.typeface.json
gentilis	bold	normal	/examples/fonts/gentilis_bold.typeface.json
droid sans	normal	normal	/examples/fonts/droid/droid_sans_regular.typeface.json
droid sans	bold	normal	/examples/fonts/droid/droid_sans_bold.typeface.json
droid serif	normal	normal	/examples/fonts/droid/droid_serif_regular.typeface.json
droid serif	bold	normal	/examples/fonts/droid/droid_serif_bold.typeface.json

5. 位图字体

BMFonts (位图字体) 可以将字形批处理为单个BufferGeometry。BMFont的渲染支持自动换行、字母间距、字句调整、signed distance fields with standard derivatives、multi-channel signed distance fields、多纹理字体等特性。详情请参阅three-bmfont-text。

现有库存的字体在项目中同样可用，就像A-Frame Fonts一样，或者你也可以从任何TTF字体中创建你自己的字体，优化时，只需要包含项目中所需的字符即可。

这是一些有用的工具：

msdf-bmfont-web (web-based)

msdf-bmfont-xml (commandline)

hiero (desktop app)