ThreeJS给模型添加介绍文字（贴在模型上 不会一直面向我们）

使用到 FontLoader跟 TextGeometry

引包

import {TextGeometry} from "three/examples/jsm/geometries/TextGeometry";
import {FontLoader} from "three/examples/jsm/loaders/FontLoader";

使用

// 创建字体加载器并加载字体
const fontLoader = new FontLoader();
//注意这里用到的json 现在文字字体然后在网上在线直接转成json
fontLoader.load('/static/ziti.json', function (font) {// 创建材质 就是控制字体颜色其实const textMaterial = new THREE.MeshBasicMaterial({color: '#00ff00'});// 创建文字几何体const textGeometry = new TextGeometry('贴图文字', {font: font,size: 80,height: 0.2,curveSegments: 12,bevelEnabled: true,bevelThickness: 0.1,bevelSize: 0.1,bevelOffset: 0,bevelSegments: 5});
})
const mesh123 = new THREE.Mesh(textGeometry, textMaterial);
mesh123.position.x = position.x
mesh123.position.y = position.y
mesh123.position.z = position.z
//mesh123.name = 'mesh123Text'
//mesh123.rotation.x = -Math.PI / 2
scene.add(mesh123);

辅助网格（方便定位文字在哪里）

 // 创建网格并添加到场景
// 4000 网格大小 20 网格数量   网格颜色
var gridHelper = new THREE.GridHelper(4000, 20, '#00ff00', '#0000ff'); 
gridHelper.position.set(0, 20, -.1) //设置位置
gridHelper.visible = true // 设置网格显示和隐藏
scene.add(gridHelper);