Babylonjsは、スケルトンとボーンを作成するAPIを提供します。
さまざまな関数の構文を見てみましょう。
BABYLON.Skeleton = function (name, id, scene)BABYLON.Bone = function (name, skeleton, parentBone, matrix)*Skeletons and Bones* はブレンダーを使用して作成でき、同じものを.babylonjsにエクスポートできます。<!doctype html>
<html>
<head>
<meta charset = "utf-8">
<title>BabylonJs - Basic Element-Creating Scene</title>
<script src = "babylon.js"></script>
<style>
canvas {width: 100%; height: 100%;}
</style>
</head>
<body>
<canvas id = "renderCanvas"></canvas>
<script type = "text/javascript">
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
var createScene = function() {
var scene = new BABYLON.Scene(engine);
//Adding a light
var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(20, 20, 100), scene);
//Adding an Arc Rotate Camera
var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0.8, 100, BABYLON.Vector3.Zero(), scene);
camera.attachControl(canvas, false);
BABYLON.SceneLoader.ImportMesh(
"him", "scenes/Dude/", "Dude.babylon", scene, function (newMeshes, particleSystems, skeletons) {
var dude = newMeshes[0];
console.log(dude);
dude.rotation.y = Math.PI;
dude.position = new BABYLON.Vector3(0, 0, -80);
scene.beginAnimation(skeletons[0], 0, 100, true, 1.0);
})
return scene;
};
var scene = createScene();
engine.runRenderLoop(function() {
scene.render();
});
</script>
</body>
</html>上記のデモリンクでは、Dude.babylonメッシュを使用しています。 Dude.babylonのjsonファイルはここからダウンロードできます-
以下に示すように、ファイルをシーンに保存して出力を取得します。
上記のコード行は、次の出力を生成します-
インポートメッシュには、babylonjsの男メッシュを使用しました。
メッシュはスケルトンを提供します。 たとえば、skeleton = skeletons [0];
スケルトンから骨を取得するには、次のコマンドを実行します-
skeleton.bones;//it gives a array.上記のデモでは、2つの球体を作成し、メッシュに渡しました。 このために、次のコマンドを実行しました-
sphere.attachToBone(skeleton.bones[30], dude);And,
sphere1.attachToBone(skeleton.bones[40], dude);*attachToBone* は、骨に任意のメッシュを与えることができる関数です。*Skeleton.bones [30]* および *skeleton.bones [40]* は、スケルトンの手を指します。
