Three.js中的TextGeometry

Question

我在Three.js r74中的TextGeometry遇到了一些问题。

如何正确实施？

这是我的Codepen：

codepen.io/cheesyeyes/pen/eJqZxK

提前致谢！

Answer 1

Okey，对于每个正在寻找简单答案的人而不是链接和指向其他重载示例的链接：

必须首先使用三个js FontLoader加载

字体：

var loader = new THREE.FontLoader();
loader.load( 'fonts/fontname.js', function ( font ) {

  var textGeometry = new THREE.TextGeometry( "text", {

    font: font,

    size: 50,
    height: 10,
    curveSegments: 12,

    bevelThickness: 1,
    bevelSize: 1,
    bevelEnabled: true

  });

  var textMaterial = new THREE.MeshPhongMaterial( 
    { color: 0xff0000, specular: 0xffffff }
  );

  var mesh = new THREE.Mesh( textGeometry, textMaterial );

  scene.add( mesh );

});   

Answer 2

我还要补充一点，您可以通过TypeFace.js将任何现有的OTF或TTF字体转换为JSON或JS字体，这是FontLoader能够加载它的必要条件。