webgl - babylonjs skybox texture not showing

Question

I have a problem with a texture of a skybox made in webgl using babylonjs. My whole project is on the webserver and everything seemd to be good written but the box which should be a skybox doesn't show the texture - black outside and inside

code:

var skybox = BABYLON.Mesh.CreateBox("skyBox", 1000.0, scene);
var skyboxMaterial = new BABYLON.StandardMaterial("skyBox", scene);
skyboxMaterial.backFaceCulling = false;
skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture("skybox/skybox", scene);
skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE;
skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0);
skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0);
skybox.material = skyboxMaterial;

Answer 1

The code seems right. Could you check with F12 bar if the textures are correctly loaded?

Answer 2

I had the same problem. Simply add a free camera to solve this:

var freeCamera = new BABYLON.FreeCamera("FreeCamera", new BABYLON.Vector3(0, 0, 5), scene);
scene.activeCamera = freeCamera;

You should see your skybox. Thanks

Answer 3

First check your fog, it will not let you see the skybox, try to remove it. In my case was: I copied the code, and it was too big for my scene, I didn't notice the change. then I decrease the

    var skybox = BABYLON.Mesh.CreateBox("skyBox", 800.0, scene);

to

    var skybox = BABYLON.Mesh.CreateBox("skyBox", 52.5, scene);

and problem solved

Answer 4

I suspect your directory structure on disk is not correct for the skybox.

If you follow the babylon playground example for a skybox http://www.babylonjs-playground.com/#3458P (and then download the zip for the complete working example)

You can see that in your case "skybox/skybox" means a directory called "skybox" containing 6 skybox files i.e.

• "skybox" directory containing files named
  • skybox_nx.jpg
  • skybox_px.jpg
  • skybox_ny.jpg
  • skybox_py.jpg
  • skybox_nz.jpg
  • skybox_pz.jpg