ImagePlaneクラス

a3.ImagePlaneは3D空間に画像を表示するクラスです。 1×1の平面に指定した画像をテクスチャとして貼り付けて表示します。

const img = new a3.ImagePlane('image.png');
view.scene.add(img);

平面のサイズは1×1固定なので、画像の縦横比に合わせたいときは setScale()で調整してください。

img.setScale(1.5,1,1); // 横長の画像に合わせる例

Billboardモードとの組み合わせ

画像は平面なので、横から見ると見えなくなってしまいます。 Billboardモードと組み合わせて常にカメラの 方を向かせると、どこから見ても画像が見えるようになります。 木や人物の看板のような使い方ができます。

import * as a3 from 'a3js';

const view = new a3.Window(600,300);
const obj = new a3.ImagePlane('/a3js/assets/kinkakuji.jpg');
obj.setMode('Billboard',{target: view.camera});
view.scene.add(obj);

// 画像が3D空間を動き回っても常にこちらを向く
let t = 0;
while (true) {
  t += await view.waitForRender();
  obj.setPosition(3*Math.sin(t),0,3*Math.cos(t)+3);
}

サンプルでは画像が3D空間をぐるぐる動き回りますが、Billboardモードの おかげで常にこちらを向いています。マウスでカメラを動かして 確認してみてください。

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