Threejs:创建文字
1. DOM + CSS
2. 将文字绘制到画布中,并将其用作Texture(纹理)
如果你希望在three.js的场景中的平面上轻松地绘制文本,请使用此方法。
3. 在你所喜欢的3D软件里创建模型,并导出给three.js
如果你更喜欢使用3D建模软件来工作并导出模型到three.js,请使用这种方法。
4. three.js自带的文字几何体
如果你更喜欢使用纯three.js来工作,或者创建能够由程序改变的、动态的3D文字,你可以创建一个其几何体为THREE.TextGeometry的实例的网格:
new THREE.TextGeometry( text, parameters );
文本缓冲几何体(TextGeometry)
一个用于将文本生成为单一的几何体的类。 它是由一串给定的文本,以及由加载的font(字体)和该几何体ExtrudeGeometry父类中的设置所组成的参数来构造的。
//创建一个简单的矩形 const geometry2 = new THREE.BufferGeometry(); // 创建一个简单的矩形. 在这里我们左上和右下顶点被复制了两次。 // 因为在两个三角面片里,这两个顶点都需要被用到。 const vertices = new Float32Array([ -1.0, -1.0, 1.0, 1.0, -1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0, 1.0, -1.0, 1.0, 1.0, -1.0, -1.0, 1.0, ]); // itemSize = 3 因为每个顶点都是一个三元组。 geometry2.setAttribute("position", newTHREE.BufferAttribute(vertices, 3)); const material2 = new THREE.MeshBasicMa terial({ color: 0xff0000 }); const mesh = new THREE.Mesh(geometry2, material2);