bellengerd Posted July 23, 2014 Share Posted July 23, 2014 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><html xmlns="http://www.w3.org/1999/xhtml"><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. Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted July 23, 2014 Share Posted July 23, 2014 How do you use it? Do you published it to a web server? Quote Link to comment Share on other sites More sharing options...
bellengerd Posted July 23, 2014 Author Share Posted July 23, 2014 I run it through my localhost Quote Link to comment Share on other sites More sharing options...
Dad72 Posted July 23, 2014 Share Posted July 23, 2014 Do you have a link for you to see your scene? In your code, I see that the loading of the engine. Quote Link to comment Share on other sites More sharing options...
bellengerd Posted July 23, 2014 Author Share Posted July 23, 2014 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.manifestValid manifest file not found. Scene & textures will be loaded directly from the web server --- babylon.js:28Failed to load resource: the server responded with a status of 404 (Not Found) --- http://localhost/babylon/CGI_Office/Scenes/Rabbit/Rabbit.babylonUncaught Error: 404 babylon.js:1 CGI_Office.zip Quote Link to comment Share on other sites More sharing options...
Dad72 Posted July 24, 2014 Share Posted July 24, 2014 Several things: you forget: // Attach the camera to the scenescene.activeCamera = camera;scene.activeCamera.attachControl(canvas); // Once the scene is loaded, just register a render loop to render itengine.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;}; Quote Link to comment Share on other sites More sharing options...
Temechon Posted July 24, 2014 Share Posted July 24, 2014 Hey bellengerd, you only missing this in your function, Dad is right about that :engine.runRenderLoop(function () { scene.render();}); // Attach the camera to the scenescene.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 ! Quote Link to comment Share on other sites More sharing options...
Dad72 Posted July 24, 2014 Share Posted July 24, 2014 Yes Temechon, for the name, but in the case of models it has to load, this is unnecessary. I got based on its stage. Yes scene.activeCamera was not necessary. Temechon 1 Quote Link to comment Share on other sites More sharing options...
bellengerd Posted July 24, 2014 Author Share Posted July 24, 2014 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:http://cgi-learning.com/CGIMoodle/Samples/CGI_Office/index.html 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 Quote Link to comment Share on other sites More sharing options...
GameMonetize Posted July 24, 2014 Share Posted July 24, 2014 Sounds like your server does not support .babylon file (http://cgi-learning.com/CGIMoodle/Samples/CGI_Office/Scenes/Rabbit/Rabbit.babylon) You have to add the .babylon MIME type to your server configuration Quote Link to comment Share on other sites More sharing options...
bellengerd Posted July 24, 2014 Author Share Posted July 24, 2014 That did it!! Deltakosh, dad72 and Temechon, thanks ever so much. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
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.