Jump to content

Newbie question regarding bones sample


bellengerd
 Share

Recommended Posts

Hi, I'm trying to create my first babylon piece and started by using the bones example. But when I try to run what I have I just get a blank screen. I was wondering if someone could tell me what I've done wrong.

 

HTML

 

<!DOCTYPE html>


<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>BABYLON - BASICS</title>

 

    <link href="index.css" rel="stylesheet" />

    <script src="babylon.js"></script>

    <script src="hand.js"></script>   

    <script src="scene.js"></script>

 

    <!-- CSS -->

    <!-- ------ -->

    <style>

        html, body, div, canvas {

            width: 100%;

            height: 100%;

            padding: 0;

            margin: 0;

            overflow: hidden;

        }

    </style>

 

</head>

 

<body>

 

    <div id="rootDiv">

        <!-- Main Canvas -->

        <canvas id="renderCanvas"></canvas>

    </div>

 

    </body>

 

    <!-- BABYLON SCRIPT -->

    <!-- -------------- -->

    <script type="text/javascript">

 

     var canvas = document.getElementById("renderCanvas");

    var engine = new BABYLON.Engine(canvas, true);

    var scene;

     newScene = CreateBonesTestScene(engine);

 

 

    </script>

 

 

</html>

 

 

The scene.js file is just bones.js renamed with exactly the same CreateBonesTestScene function in it. 

Link to comment
Share on other sites

I don't but I've attached my folder with all the code in. I'm wondering if I've copied bits from different version of babylon and mucked something up.

 

After trying to open it in chrome I viewed the developer console, which gives the following errors:

 

Failed to load resource: the server responded with a status of 404 (Not Found)  ---  http://localhost/babylon/CGI_Office/Scenes/Rabbit/Rabbit.babylon.manifest
Valid manifest file not found. Scene & textures will be loaded directly from the web server ---  babylon.js:28
Failed to load resource: the server responded with a status of 404 (Not Found)  ---   http://localhost/babylon/CGI_Office/Scenes/Rabbit/Rabbit.babylon
Uncaught Error: 404 babylon.js:1
 
 

CGI_Office.zip

Link to comment
Share on other sites

Several things:
 
you forget:
 
// Attach the camera to the scene
scene.activeCamera = camera;
scene.activeCamera.attachControl(canvas);
 
// Once the scene is loaded, just register a render loop to render it
engine.runRenderLoop(function () {
    scene.render();
});
 
// PS : name empty (This is not necessary and should not put any name, it must exist in the file.);
ImportMesh("", "Scenes/Rabbit/", "Rabbit.babylon", scene, function (newMeshes, particleSystems, skeletons);
 
and separate ImportMesh
 
var CreateBonesTestScene = function (engine) {    var scene = new BABYLON.Scene(engine);       var light = new BABYLON.DirectionalLight("dir01", new BABYLON.Vector3(0, -0.5, -1.0), scene);        var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0, 10, new BABYLON.Vector3(0, 30, 0), scene);    camera.setPosition(new BABYLON.Vector3(20, 70, 120));    light.position = new BABYLON.Vector3(20, 150, 70);    camera.minZ = 10.0;    // Attach the camera to the scene    scene.activeCamera = camera;    scene.activeCamera.attachControl(canvas);		    scene.ambientColor = new BABYLON.Color3(0.3, 0.3, 0.3);    // Ground    var ground = BABYLON.Mesh.CreateGround("ground", 1000, 1000, 1, scene, false);    var groundMaterial = new BABYLON.StandardMaterial("ground", scene);    groundMaterial.diffuseColor = new BABYLON.Color3(0.2, 0.2, 0.2);    groundMaterial.specularColor = new BABYLON.Color3(0, 0, 0);    ground.material = groundMaterial;    ground.receiveShadows = true;    // Shadows    var shadowGenerator = new BABYLON.ShadowGenerator(1024, light);    // Meshes    BABYLON.SceneLoader.ImportMesh("", "Scenes/Rabbit/", "Rabbit.babylon", scene, function (newMeshes, particleSystems, skeletons) {        var rabbit = newMeshes[1];                rabbit.scaling = new BABYLON.Vector3(0.4, 0.4, 0.4);        shadowGenerator.getShadowMap().renderList.push(rabbit);        var rabbit2 = rabbit.clone("rabbit2");        var rabbit3 = rabbit.clone("rabbit2");        shadowGenerator.getShadowMap().renderList.push(rabbit2);        shadowGenerator.getShadowMap().renderList.push(rabbit3);        rabbit2.position = new BABYLON.Vector3(-50, 0, -20);        rabbit2.skeleton = rabbit.skeleton.clone("clonedSkeleton");        rabbit3.position = new BABYLON.Vector3(50, 0, -20);        rabbit3.skeleton = rabbit.skeleton.clone("clonedSkeleton2");        scene.beginAnimation(skeletons[0], 0, 100, true, 0.8);        scene.beginAnimation(rabbit2.skeleton, 73, 100, true, 0.8);        scene.beginAnimation(rabbit3.skeleton, 0, 72, true, 0.8);    });		// Dude    BABYLON.SceneLoader.ImportMesh("", "Scenes/Dude/", "Dude.babylon", scene, function (newMeshes, particleSystems, skeletons) {            var dude = newMeshes[0];                        for (var index = 0; index < newMeshes2.length; index++) {                shadowGenerator.getShadowMap().renderList.push(newMeshes2[index]);            }            dude.rotation.y = Math.PI;            dude.position = new BABYLON.Vector3(0, 0, -80);                            scene.beginAnimation(skeletons2[0], 0, 100, true, 1.0);    });	    // Once the scene is loaded, just register a render loop to render it    engine.runRenderLoop(function () {        scene.render();    });    return scene;};
Link to comment
Share on other sites

Hey bellengerd, you only missing this in your function, Dad is right about that :

engine.runRenderLoop(function () {        scene.render();});

 

// Attach the camera to the scene

scene.activeCamera = camera;

 

It is not necessary to attach the activeCamera if you have only one camera (done in babylonjs by default)

 

 

// PS : name empty (This is not necessary and should not put any name, it must exist in the file.);

ImportMesh("", "Scenes/Rabbit/", "Rabbit.babylon", scene, function (newMeshes, particleSystems, skeletons);

 

The name can be necessary ! Let's say you have a babylon file with two objects in it (red_toad, blue_toad for example). If you only want to load the red_toad, you should put its name as a first parameter.

An empty string is to load all objects (red_toad AND blue_toad).

 

Cheers !

Link to comment
Share on other sites

You guys are angels and nearly got it working for me. I now get the scene to render but there are still no characters.

 

I've installed the demo on my companies test server here:


 

If you display the chrome developer tools console it shows load errors for the model files, but they are in the right place. It also shows an "unexpected token u" error.

 

You'll notice I've added some balls in there to show that other things are rendering, just not the rabbit or dude character.

 

This is really weird, I don't understand what is happening.

 

Any more help would be appreciated, even if its to say that it works on your PC's.

 

Thanks

 

Darren 

CGI_Office.zip

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...