FontLoader

在three.js中，如果想要显示出文本文字的效果，可以使用FontLoader，这是使用JSON格式中加载字体的一个类。返回Font, 返回值是表示字体的Shape类型的数组。 其内部使用FileLoader来加载文件。

TextGeometry

使用FontLoader后，生成几何体时，可以使用TextGeometry。一个用于将文本生成为单一的几何体的类。 它是由一串给定的文本，以及由加载的Font（字体）和该几何体ExtrudeGeometry父类中的设置所组成的参数来构造的。

核心：

// 文本几何体
var loader = new THREE.FontLoader(); 

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

使用示例：

具体效果：

中文乱码问题

如果将文字内容修改为中文，就会出现乱码现象

显示样式：

这是由于使用的helvetiker_regular.typeface.json不支持中文的缘故

之后我使用了Microsoft YaHei_Regular.json，可以使得中文正常显示

loader.load( './Json/Microsoft YaHei_Regular.json', function ( font ) { 
	geometry = new THREE.TextGeometry( '你好 three.js!', {
		font: font,
		size: 100,
		height: 5,
		curveSegments: 12,
		bevelEnabled: true,
		bevelThickness: 10,
		bevelSize: 2,
		bevelSegments: 5
	} );
	
	var mesh = new THREE.Mesh( geometry, material );
	mesh.scale.set(0.03,0.03,0.03);
	scene.add(mesh)
})

显示样式：

字体包

使用的字体包Microsoft YaHeiRegular.json和helvetikerregular.typeface.json可以从下面两个地方进行下载：

百度网盘：

提取码：730t

CSDN下载：

也可以使用Facetype.js进行转换