VitePress

Appearance

Text3Dクラス ​

a3.Text3Dは3D空間に立体的な文字を表示するクラスです。 ゲームのタイトルやスコア表示などに使えます。

フォントの初期化 ​

Text3Dを使う前に、a3.initFont()でフォントを読み込んでおく 必要があります。フォントを初期化せずにText3Dを作ると、 代わりに赤いボックスが表示されます。

js
await a3.initFont('/a3js/assets/M-PLUS-1_Bold.json.zip');

フォントファイルは、TTFファイルを facetype.jsで変換した three.js用のJSONファイルです。日本語フォントのようにファイルが 大きくなる場合は、JSONをZIP圧縮したファイル（.json.zip）も そのまま使用できます（例: zip abcdefg.json.zip abcdefg.json）。

使用例 ​

js
const text = new a3.Text3D("日本語もOK",{color:0xff0000});
view.scene.add(text);

第1引数が表示する文字列、第2引数のオプションで色を数値 （0xff0000のような16進数）で指定できます。

js
import * as a3 from 'a3js';

await a3.initFont('/a3js/assets/M-PLUS-1_Bold.json.zip');
const view = new a3.Window(600,300);
view.camera.setPosition(0,0,8);
const obj = new a3.Text3D("日本語もOK",{color:0xff0000});
view.scene.add(obj);

while (true) {
  obj.turnUp(1.0);
  await view.waitForRender();
}

サンプルのturnUp(1.0)は毎フレーム1度ずつ上方向の軸で回転させる メソッドで、タイトル文字をくるくる回す演出によく使えます （カーレースサンプルプログラムの タイトル画面でも使っています）。

詳細はAPIドキュメントを 参照してください。