babylon skybox from hell

Question

Я изучаю учебные пособия для babylonjs, и я вытягивал свои волосы поверх многих вещей. Я нахожусь в первом учебном пособии по окружающей среде, и я пытаюсь отобразить свой skybox. предполагая, что пути к файлам верны, какова может быть проблема?

var canvas, 
    createScene, 
    engine; 

// Get the canvas element from our HTML below 
canvas = document.querySelector("#renderCanvas"); 
// Load the BABYLON 3D engine 
engine = new BABYLON.Engine(canvas, true); 

// Here begins a function that we will 'call' just after it's built 
createScene = function() { 

    var scene = new BABYLON.Scene(engine); 

    // this is how to set or change the background color 
    // the .clearColor method is used with the new BABYLON.Color3(); 
    scene.clearColor = new BABYLON.Color3(0.5, 0.8, 0.5); 
    // there are also preset colors like blue, red, yellow you can add by saying BABYLON.Color3.Blue(); 

    // ambient color is used to help determine what things will ultimately look like. 
    scene.ambientColor = new BABYLON.Color3(0.3, 0.3, 0.3); 

    // when there is no ambient color on the scene, ambient colors on textures and ambient colors of your objects will have no effect. 

    var camera = new BABYLON.ArcRotateCamera("Camera", 0.4, 1.2, 20, new BABYLON.Vector3(-10, 0, 0), scene); 
    var light0 = new BABYLON.HemisphericLight("Hemi0", new BABYLON.Vector3.Zero(), scene); 
    light0.diffuse = new BABYLON.Color3(1, 1, 1); 
    light0.specular = new BABYLON.Color3(1, 1, 1); 
    light0.groundColor = new BABYLON.Color3(0, 0, 0); 

    // skybox 
    var skybox = BABYLON.Mesh.CreateBox('skyBox', 100.0, scene); 
    console.log(skybox); 
    var skyboxMaterial = new BABYLON.StandardMaterial('skyBox', scene); 
    skyboxMaterial.backFaceCulling = false; 
    skybox.material = skyboxMaterial; 

    // infanite distance makes the sky box follow the camera's position 
    skybox.infiniteDistance = true; 

    // here, we remove all light relection from the shape 
    skyboxMaterial.diffuseColor = new BABYLON.Color3(0, 0, 0); 
    skyboxMaterial.specularColor = new BABYLON.Color3(0, 0, 0); 

    // now we apply the texture to the box 
    skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture('data/images/skybox', scene); 
    skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE; 

    scene.activeCamera = camera; 
    scene.activeCamera.attachControl(canvas); 

    return scene; 
}; // End of createScene function 

// ------------------------------------------------------------- 
// Now, call the createScene function that you just finished creating 
var scene; 

scene = createScene(); 
// Register a render loop to repeatedly render the scene 
engine.runRenderLoop(function() { 
    scene.render(); 
}); 
// Watch for browser/canvas resize events 
window.addEventListener('resize', function() { 
    engine.resize(); 
}); 

Answer 1

Путь к вашим изображениям неверен (или ваших изображений нет, неверно названо, а не jpegs и т. Д.).

Я взял ваш playground example, то переформатировать (в детской площадке код, который вы только дать функцию createScene;. Он делает остальную часть кода подмостей для вас, я также исправлена ​​ошибка .Zero() синтаксис был жалуетесь, просто используя new BABYLON.Vector3(0,0,0) (Я не знаю, почему .Zero() был плох, но (0,0,0) такого же количество символов)

в тот момент он еще не сделал ничего Тогда я изменил путь к где найдены площадке демонстрационных изображений это работает.. http://www.babylonjs-playground.com/#1XQWKQ#9

Таким образом, «данные/изображения/skybox» не являются w здесь ваши изображения. Помните, что вы должны обслуживать их через веб-сервер. Если он по-прежнему не работает, попробуйте устранить неполадки, указав полный путь (см., Например, http://www.babylonjs-playground.com/#1XQWKQ#10). Если они находятся на другом сервере, вы можете столкнуться с проблемами CORS (лучшее решение для этого: сохранить их на том же сервере, что и ваш html-файл!).