Animating Bones after Using Blender Exporter

[capn_ace]

Good day everyone at the Babylon.js section forum. I've been looking at babylon for about a week and have been trying to get a mesh to animate for three days now. I used blender for the asset and used the correct exporter taken from GitHub to generate the .babylon file. I tried modifying my .js file, .blend file, and the exporter's .py file but nothing has worked yet. I applied an armature modifier to my mesh so that the mesh would be parent of the armature instead of the other way around. I did this because I thought that maybe the exporter was having problems linking the armature to the mesh. Still nothing was resolved.

 

From the .log file I can see that the exporter detects that the armature is animated yet from the debug console on IE I'm guessing that this animation for some reason isn't being imported into the babylonjs scene. The target parameter of the beginAnimation function reads 'null'.

 

Below is my .js file and my .log file. I tried to make my .js file as simple as possible because I just want to see the animation run on babylon. I've seen a lot of code where people nest functions in other function but I'm just going for a simplified approach right now.

 

Here is the .js file

 

/// <reference path="/scripts/babylon.js" />

"use strict";

var canvas;
var engine;
var scene;

document.addEventListener("DOMContentLoaded", startBabylonJS, false);

function startBabylonJS() {
    if (BABYLON.Engine.isSupported()) {
        canvas = document.getElementById("renderCanvas");
        engine = new BABYLON.Engine(canvas, true);

        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, new BABYLON.Vector3.Zero(), scene);
        camera.attachControl(canvas, false);

        BABYLON.SceneLoader.ImportMesh("Mesh", "", "MeshAnim.babylon", scene)
        
        scene.beginAnimation(scene.getSkeletonByName("Mesh_Armature"), 1, 40, true);
        
        engine.runRenderLoop(function () {
            scene.render();
        });
    }
}

 

and the .log file

 

    Babylon.js Exporter version: 1.8.0, Blender version: 2.74 (sub 0)
========= Conversion from Blender to Babylon.js =========
    Python World class constructor completed
    WARNING: No active camera has been assigned, or is not in a currently selected Blender layer
    processing begun of material:  MeshAnim.Texture
    Diffuse texture found
    processing begun of mesh:  Mesh
        num positions      :  1080
        num normals        :  1080
        num uvs            :  2160
        num uvs2           :  0
        num colors         :  0
        num indices        :  2163
    processing begun of skeleton:  Mesh_Armature, id:  0
    processing begun of bone:  Bone.002, index:  0
    animation begun of bone:  Bone.002
    processing begun of bone:  Bone.003, index:  1
    animation begun of bone:  Bone.003
    processing begun of bone:  Bone.004, index:  2
    animation begun of bone:  Bone.004
    processing begun of bone:  shoulder.L, index:  3
    animation begun of bone:  shoulder.L
    processing begun of bone:  elbow.L, index:  4
    animation begun of bone:  elbow.L
    processing begun of bone:  shoulder.R, index:  5
    animation begun of bone:  shoulder.R
    processing begun of bone:  elboow.R, index:  6
    animation begun of bone:  elboow.R
    processing begun of bone:  thigh.R, index:  7
    animation begun of bone:  thigh.R
    processing begun of bone:  shin.R, index:  8
    animation begun of bone:  shin.R
    processing begun of bone:  thigh.L, index:  9
    animation begun of bone:  thigh.L
    processing begun of bone:  shin.L, index:  10
    animation begun of bone:  shin.L
    processing complete of skeleton:  Mesh_Armature
========= Writing of scene file started =========
========= Writing of scene file completed =========
========= end of processing =========
 

 

The error that IE gives is "Unable to get property 'animations' of undefined or null reference".

 

Thanks in advance.

[GameMonetize]

Hello,

 

to get your skeleton you should uses the complete importMesh function (which gives you loaded skeletons):

 

https://github.com/BabylonJS/Babylon.js/blob/master/Babylon/Loading/babylon.sceneLoader.ts#L6

 

The callback function will give you:(meshes: AbstractMesh[], particleSystems: ParticleSystem[], skeletons: Skeleton[])

[capn_ace]

Thanks a lot for your help Deltakosh. I finally got the bones to animate with your help. I guess that's what I get for trying to cut corners without understanding the Babylon.js library.

 

This is the modified code

 

/// <reference path="/scripts/babylon.js" />

"use strict";

var canvas;
var engine;
var scene;

document.addEventListener("DOMContentLoaded", startBabylonJS, false);

function startBabylonJS() {
    if (BABYLON.Engine.isSupported()) {
        canvas = document.getElementById("renderCanvas");
        engine = new BABYLON.Engine(canvas, true);

        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, new BABYLON.Vector3.Zero(), scene);
        camera.attachControl(canvas, false);

        BABYLON.SceneLoader.ImportMesh("Mesh", "", "MeshAnim.babylon", scene, function (newMeshes, particleSystems, skeletons) {
            scene.beginAnimation(skeletons[0], 1, 40, true, 1.0);
        }),
        
        engine.runRenderLoop(function () {
            scene.render();
        });
    }
}

 

I also had to revert to the original .blend file I had because I had played around with it, trying to get my problem fixed.

 

Although my mesh right now is breaking into pieces but I guess that's a different issue with how I set up the armature in Blender.

[gryff]

Although my mesh right now is breaking into pieces but I guess that's a different issue with how I set up the armature in Blender.

 

capn_ace : Want to post your .blend file - the one with Mesh parented to the armature -  somewhere so I can take a look?

 

cheers, gryff

[capn_ace]

Of course: https://dl.dropboxusercontent.com/u/98458890/MeshAnim.blend

right click > save as

 

I removed the texture because I ripped this model from a game to create a prototype in babylon.

[capn_ace]

I was able to fix the deformation problem with my animation in babylon. I applied rotation and scale to both the mesh and the armature in Blender. I'm betting that Babylonjs assumes you've done this, for obvious reasons, and that's probably why I had the strange deformations in my animation.

 

So basically by selecting the mesh in object mode and then Ctrl-A -> Rotation & Scale. The same procedure again for the armature.

 

Here is the animation after also playing around with the light and position of the mesh

https://db.tt/AaV0Lkp2

[gryff]

I was able to fix the deformation problem with my animation in babylon. I applied rotation and scale to both the mesh and the armature in Blender.

 

Glad you got it sorted capn. That is something you always have to keep your eye on when creating animated characters. See these videos by Lee Salevimini

 

I ripped this model from a game to create a prototype in babylon.

 

No need to rip stuff - try using MakeHuman (free) works well with Blender. Or go to Blendswap - lots of free rigged characters there.

 

A character I made with MakeHuman - The Blue Lady

 

cheers, gryff

[gryff]

capn: You can find more about my workflow for animating the "Blue Lady" here

 

cheers, gryff

[capn_ace]

Glad you got it sorted capn. That is something you always have to keep your eye on when creating animated characters. See these videos by Lee Salevimini

 

 

No need to rip stuff - try using MakeHuman (free) works well with Blender. Or go to Blendswap - lots of free rigged characters there.

 

A character I made with MakeHuman - The Blue Lady

 

cheers, gryff

 

 

capn: You can find more about my workflow for animating the "Blue Lady" here

 

cheers, gryff

 

Actually I've already seen your work and it helped me a lot with understanding the animation process in Babylonjs. I failed to mention that.

 

I should've also clarified what type of prototype I'm building. It's a personal prototype that I'm building for myself out of ripped assets for the nostalgic factor.

[gryff]

It's a personal prototype that I'm building for myself out of ripped assets for the nostalgic factor.

 

 

Ahh understand capn. Get that way sometimes about "Commander Keen"

 

cheers, gryff