Three.js天空盒不加载

问题描述：

我对Three.JS是全新的，并且似乎无法让我的脑袋在我的场景中出现天空盒。我没有从我的代码中得到任何错误，这让我难倒了。任何帮助将不胜感激。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);  

}

'imageList + faces [i] + imgType'其结果应该是'CubeMapHDR0001.jpg'还是'CubeMap/HDR0001.jpg'？ – prisoner849

答

你在哪里看你的日志中的警告/错误？似乎很奇怪你没有得到任何反馈，因为THREE.ImageUtils.loadTexture已弃用，请使用TextureLoader.load而不是，如果您使用的是稍后版本的三个js，则会显示此警告。

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

Three.js天空盒不加载

相关推荐