babylon.js texture from blender

Question

I have some basic issue (I think) when I try to export a scene from Blender to Babylon.js. I think I don't really understand how textures work.

Let's take a basic example. I create a new scene on Blender. There's juste a light, a camera and a cube. I change nothing on the cube options. I just apply a texture from a jpg on the standard material. It looks like this :

I use the Babylon exporter to have a .babylon file. But when I import it, the texture is not applied.

Result :

I really don't understand why... Is there something special to do to make textures being imported ?

Here is my import code :

<script>
var canvas = document.getElementById("renderCanvas");
var engine = new BABYLON.Engine(canvas, true);
BABYLON.SceneLoader.Load("", "test.babylon", engine, function (newScene) {
    // Wait for textures and shaders to be ready
    newScene.executeWhenReady(function () {
        // Attach camera to canvas inputs
        newScene.activeCamera.attachControl(canvas);

        // Once the scene is loaded, just register a render loop to render it
        engine.runRenderLoop(function() {
            newScene.render();
        });
    });
}, function (progress) {
    // To do: give progress feedback to user
});
</script>

Answer 1

Find diffuseTexture attribute from test.babylon file and replace all attribute value with your image path eg:

"diffuseTexture":{"name":"images/16.png"} 

or add texture value using javascript eg:

var floorMaterial = newScene.materials[3];

var floorTexture = new BABYLON.Texture("images/06.jpg", newScene);

Answer 2

Shivaan Keldon (who asked the question) answered it in a comment:

Got it ! When using textures with Babylon.js, you must unwrap the UV map before applying the texture in Blender !