このページの原文： https://doc.babylonjs.com/start/chap3/parent
👥 3-01: メッシュの親子関係 (Mesh Parents)
村を移動する非常にシンプルな車を追加します。
どんなにシンプルな車でも車輪が必要で、車のボディと車輪を組み合わせる必要があります。
merge meshes (マージメッシュ) を使用してそれらを結合すると、(完全にがっちゃんこするので) 車輪が回転できなくなります。
代わりに、車のボディを各車輪の親として設定します。
子メッシュ.parent = 親メッシュ
親での位置、スケーリング、ローテーション (回転) の使用は、子にも適用されます。
子の位置の設定は親スペースで行われ、子の回転とスケールの設定は子のローカルスペースで行われます。
次の Babylon.js Playground で各値を変更し、親と子への影響を確認することができます。
createScene 関数内
const boxParent = BABYLON.MeshBuilder.CreateBox("Box", {faceColors:faceColors});
const boxChild = BABYLON.MeshBuilder.CreateBox("Box", {size: 0.5, faceColors:faceColors});
// ↓ 親子関係に設定している
boxChild.setParent(boxParent);
// ↓ ここで子boxの座標をいじると子boxだけが動く
boxChild.position.x = 0;
boxChild.position.y = 2;
boxChild.position.z = 0;
boxChild.rotation.x = Math.PI / 4;
boxChild.rotation.y = Math.PI / 4;
boxChild.rotation.z = Math.PI / 4;
// ↓ ここで親boxの座標をいじると子boxごと一緒に動く
boxParent.position.x = 2;
boxParent.position.y = 0;
boxParent.position.z = 0;
boxParent.rotation.x = 0;
boxParent.rotation.y = 0;
boxParent.rotation.z = -Math.PI / 4;
const boxChildAxes = localAxes(1, scene);
boxChildAxes.parent = boxChild;
localAxes 関数内
const local_origin = new BABYLON.TransformNode("local_origin");
// ↓ ここで親子関係に設定している
local_axisX.parent = local_origin;
local_axisY.parent = local_origin;
local_axisZ.parent = local_origin;
return local_origin;
これで、車を作成し、アニメーションを適用する準備が整いました。
👀 さらなる学び（参考）
Parents and Pivots