Question

我对Three.JS来说是全新的，似乎无法让我的脑海中出现一个天空盒出现在我的场景中。我没有从我的代码中得到任何错误，这让我感到难过。任何帮助将不胜感激。

function createSky(){

    var imageList = "CubeMap"

    THREE.ImageUtils.crossOrigin = '';
    var faces  = ["HDR0001", 
                  "HDR0002", 
                  "HDR0003", 
                  "HDR0004", 
                  "HDR0005"]; 

    var imgType = ".jpg";
    var skyGeo  = new THREE.CubeGeometry (500, 500, 500);
    var matFacesArray = [];

    for (var i = 0; i < 6; i++) {
         matFacesArray.push( new THREE.MeshBasicMaterial({
            map: THREE.ImageUtils.loadTexture( imageList + faces[i] + imgType ),        
            side: THREE.BackSide
         }));

    }      

    var sky = new THREE.MeshFaceMaterial ( matFacesArray );
    var skyBox = new THREE.Mesh ( skyGeo, sky );
    scene.add ( skyBox );    

}

Answer 1

您在哪里查看日志中的警告/错误？由于 THREE.ImageUtils.loadTexture已被弃用，使用TextureLoader.load而不是，似乎很难得到任何反馈，如果您使用的是稍后版本的三个j，则会显示此警告。

另外，您使用的浏览器是什么？我发现Firefox通常比Chrome显示纹理更慷慨。这与跨源图像加载有关，当您尝试在本地运行代码时可能会出现问题。

Three.js skybox没有加载

1 个答案: