Texture image file not working on Xampp localhost

MattJ · October 7, 2017

Hello,

I'm new to Babylon.js, and not a very experienced programmer. I'm trying to learn Babylon.js, and I made a simple scene to run from firefox localhost. I'm using Xampp Apache, and all the files (my project html, babylon.js, and image file) are in the XAmpp htdocs folder.

It seems I can't use an texture image. Any mesh having this texture is completely missing in the rendered scene. Otherwise, the babylon.js works just fine.

I'm clueless, what am I missing. The folders and file locations are ok, the image works just fine within another scripts

Here is my code included:

<hmtl>

<body>

window.addEventListener("DOMContentLoaded", function (){

console.log("Loaded Dom content");
var canvas = document.getElementById("Main");
var engine = new BABYLON.Engine(canvas, true);

var scene = createScene();
scene.render();

function createScene() {

var scene = new BABYLON.Scene(engine);

     var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);
    camera.setTarget(BABYLON.Vector3.Zero());
    camera.attachControl(canvas, true);

var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 2, 0), scene);
light.intensity = 0.9;

    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);
   var box = BABYLON.Mesh.CreateBox("box1",2.0,scene);

    sphere.position.y = 3;
   box.position.y = 1;

   var m1 = new BABYLON.StandardMaterial("material1",scene);
    m1.diffuseColor = new BABYLON.Color3(1,0,0);
   sphere.material = m1;

   var m2 = new BABYLON.StandardMaterial("material2",scene);
    m2.diffuseTexture = new BABYLON.Texture("paper.jpg",scene); // this is the problematic line of code

   box.material = m2;

    var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);

return scene;

}

});

</script>

</body>

<html>

MattJ · October 8, 2017

I solved this myself, maybe this can be useful to other beginners too.

I should have been more accurate about the program structure.

Using function call "function createscene() " caused the problem. Must use "var createscene = function() " - type of structure.

One should always follow the instructions about the syntax and structure to the detail, of course.

Sign In

Texture image file not working on Xampp localhost

Recommended Posts

MattJ

Link to comment

Share on other sites

MattJ

Link to comment

Share on other sites

Join the conversation

Recently Browsing 0 members

Browse

Activity