BabylonJS - 骨骼和骨架
Babylonjs 提供创建骨架和骨骼的 API。
语法
现在让我们看看不同函数的语法。
对于骨架
BABYLON.Skeleton = function (name, id, scene)
对于骨骼
BABYLON.Bone = function (name, Skeleton, ParentBone, matrix)
骨骼和骨骼可以使用 blender 创建,并且可以在 .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); //添加光源 var light = new BABYLON.PointLight("Omni", new BABYLON.Vector3(20, 20, 100), scene); //添加弧形旋转相机 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 dude 网格。
网格为我们提供了骨架。例如,skeleton = Skeletons[0];
要从骨架中获取骨骼,请执行以下命令 −
skeleton.bones; //它给出一个数组。
在上面的演示中,我们创建了 2 个球体并传递给网格。为此,我们执行了以下命令 −
sphere.attachToBone(skeleton.bones[30], dude);
并且,
sphere1.attachToBone(skeleton.bones[40], dude);
attachToBone 是一个函数,你可以将任意网格赋予骨骼。
Skeleton.bones[30] 和 skeleton.bones[40] 指的是骨架的手。