メインコンテンツまでスキップ

entities

名前による Bevy ECS エンティティ(entity)の検索と操作を行います。エンティティは 3D シーンの構成要素です -- VRM キャラクター、カメラ、WebView、スポーンされたオブジェクトはすべて、数値 ID、オプションの名前、トランスフォーム(位置、回転、スケール)を持つエンティティです。

インポート

import { entities } from "@hmcs/sdk";

エンティティの検索

findByName

人間が読める名前でエンティティを検索します。一致するものが見つからない場合はエラーをスローします。

const vrmEntity = await entities.findByName("MyCharacter");

root オプションを渡すと、特定のエンティティの子要素内のみを検索します -- VRM 階層内のボーンを見つける場合に便利です:

const headBone = await entities.findByName("head", {
root: vrmEntity,
});

シグネチャ:

entities.findByName(name: string, options?: FindOptions): Promise<number>

エンティティ名

エンティティ ID に紐づけられた名前を取得します:

const entityName = await entities.name(vrmEntity);
console.log(entityName); // "MyCharacter"

トランスフォーム

すべてのエンティティは、3D 空間での位置、回転、スケールを記述する トランスフォーム を持っています。

読み取り

const t = await entities.transform(vrmEntity);
console.log("位置:", t.translation); // [x, y, z]
console.log("回転:", t.rotation); // [x, y, z, w] クォータニオン
console.log("スケール:", t.scale); // [x, y, z]

書き込み

setTransform部分的な トランスフォームを受け付けます -- 指定したフィールドのみが更新されます:

// エンティティを上方向に 100 ユニット移動(回転とスケールは変更なし)
await entities.setTransform(vrmEntity, {
translation: [0, 100, 0],
});

// 3 つのコンポーネントを一度に更新
await entities.setTransform(vrmEntity, {
translation: [50, 0, -25],
rotation: [0, 0.707, 0, 0.707], // Y 軸 90 度回転
scale: [1.5, 1.5, 1.5],
});

移動

entities.move は、ワールド 座標または ビューポート(スクリーン空間)座標を使用してエンティティを再配置します。

ワールド座標

3D ワールド空間でエンティティの位置を直接設定します。z フィールドはオプションです -- 省略した場合、エンティティは現在の z 値を保持します。

await entities.move(vrmEntity, {
type: "world",
position: [0, 1.5],
z: -2,
});

// 現在の z を保持
await entities.move(vrmEntity, {
type: "world",
position: [0, 1.5],
});

ビューポート座標

スクリーンピクセル座標を渡すと、エンジンが自動的にワールド空間に変換します:

await entities.move(vrmEntity, {
type: "viewport",
position: [500, 300],
});

トゥイーン

イージング関数を使用して、エンティティの位置、回転、スケールを時間経過でスムーズにアニメーションさせます。各トゥイーン関数は TweenPositionRequestTweenRotationRequestTweenScaleRequest を受け付けます。

tweenPosition

await entities.tweenPosition(vrmEntity, {
target: [100, 50, 0],
durationMs: 1000,
easing: "quadraticInOut",
wait: true, // アニメーション完了までブロック
});

tweenRotation

await entities.tweenRotation(vrmEntity, {
target: [0, 0, 0.7071, 0.7071], // Z 軸 90 度
durationMs: 500,
easing: "elasticOut",
});

tweenScale

await entities.tweenScale(vrmEntity, {
target: [2, 2, 2],
durationMs: 800,
easing: "bounceOut",
wait: false, // ファイアアンドフォーゲット
});

3 つすべてが同じオプションフィールドを共有しています:

フィールドデフォルト説明
target[number, number, number](回転の場合は 4 要素)--ターゲット値
durationMsnumber--ミリ秒単位のアニメーション持続時間
easingEasingFunction"linear"加速カーブ
waitbooleanfalseトゥイーン完了までブロックするかどうか

イージング関数

EasingFunction 型は、トゥイーンの加速カーブを定義します。型としてインポートしてください:

import { type EasingFunction } from "@hmcs/sdk";

利用可能な値:

グループInOutInOut
Linear"linear"----
Quadratic"quadraticIn""quadraticOut""quadraticInOut"
Cubic"cubicIn""cubicOut""cubicInOut"
Quartic"quarticIn""quarticOut""quarticInOut"
Quintic"quinticIn""quinticOut""quinticInOut"
Sine"sineIn""sineOut""sineInOut"
Circular"circularIn""circularOut""circularInOut"
Exponential"exponentialIn""exponentialOut""exponentialInOut"
Elastic"elasticIn""elasticOut""elasticInOut"
Back"backIn""backOut""backInOut"
Bounce"bounceIn""bounceOut""bounceInOut"
Smooth Step"smoothStepIn""smoothStepOut""smoothStep"
Smoother Step"smootherStepIn""smootherStepOut""smootherStep"

FindOptions

interface FindOptions {
/** この指定エンティティの子要素に検索を制限します。 */
root?: number;
}

MoveTarget

type MoveTarget =
| { type: "world"; position: Vec2; z?: number }
| { type: "viewport"; position: Vec2 };

TweenPositionRequest

interface TweenPositionRequest {
target: [number, number, number];
durationMs: number;
easing?: EasingFunction;
wait?: boolean;
}

TweenRotationRequest

interface TweenRotationRequest {
target: [number, number, number, number];
durationMs: number;
easing?: EasingFunction;
wait?: boolean;
}

TweenScaleRequest

interface TweenScaleRequest {
target: [number, number, number];
durationMs: number;
easing?: EasingFunction;
wait?: boolean;
}

TransformVec2Vec3Quat については Math Types を参照してください。

次のステップ

  • Math Types -- ベクトル、クォータニオン、トランスフォームの型定義。
  • Coordinates -- スクリーン空間とワールド空間の座標変換。
  • VRM モジュール -- VRM キャラクターのスポーンと制御(内部的にはエンティティです)。