threejs绘制中文方案

1.使用threejs创建文字几何体

需要找个 ttf 中文字体在 http://gero3.github.io/facetype.js/ 上转换为TypeFace格式的json文件。

import {FontLoader} from "../librarys/jsm/loaders/FontLoader.js";
import {TextGeometry} from '../librarys/jsm/geometries/TextGeometry.js';
  test2() {
    new FontLoader().load("http://localhost:8081/examples/models/gltf/PingFang.json", (response)=> {
      let hello = new TextGeometry("文字几何体", {
        font: response,
        fontName: "PingFang",
        size: 1,             // 字体大小，默认值为100
        height: 1,           // 挤出文本的厚度。默认值为50
        hover: 10,
        curveSegments: 10,   // 弧线分段数，使得文字的曲线更加光滑
        bevelThickness: 2,   // 文本上斜角的深度，默认值为20
        bevelSize: 1,        // 斜角与原始文本轮廓之间的延伸距离。默认值为8
        bevelSegments: 3,    // 斜角的分段数。默认值为3
        bevelEnabled: false  // 是否使用倒角，意为在边缘处斜切
      });
      let material = new THREE.MeshLambertMaterial({ color: 0xffffff } );
      let fontObj = new THREE.Mesh(hello, material);
      fontObj.position.set(0, 0, 0);
      this.scene.add(fontObj);
    });
  }

标签：threejs,FontLoader,中文,js,fontObj,TextGeometry,new,默认值,绘制
来源： https://blog.csdn.net/qq_34122822/article/details/122473154