three.js : テキストを原点に表示する

目次

スポンサードリンク

demo

テキストの中央寄せは作成した TextGeometry の関数 center を呼び出す。


//文字を生成
var loader = new THREE.FontLoader();
loader.load('/fonts/helvetiker_regular.typeface.json', function(font){
  var textGeometry = new THREE.TextGeometry("DIG DEEP", {
    font: font,
    size: 60,
    height: 20,
    curveSegments: 12
  });

  // テキストの中央を原点に合わせる
  textGeometry.center();

  var materials = [
    new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, overdraw: 0.5 } ),
    new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, overdraw: 0.5 } )
  ];
  var textMesh = new THREE.Mesh(textGeometry, materials);
  scene.add(textMesh);
});