2016-12-01 5 views
0

Je suis complètement nouveau à Three.JS et ne peux pas avoir l'air d'obtenir ma tête pour faire apparaître une skybox dans ma scène. Je ne reçois aucune erreur de mon code, ce qui m'a laissé perplexe. Toute aide serait grandement appréciée.Three.js skybox ne charge pas

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);  

} 
+0

'imageList + visages [i] + imgType' devrait être le résultat' 'CubeMapHDR0001.jpg' ou cubemap/HDR0001.jpg'? – prisoner849

Répondre

0

Où regardez-vous votre journal pour les avertissements/erreurs? semble étrange que vous n'obtenez des commentaires depuis THREE.ImageUtils.loadTexture est dépréciée, utilisez TextureLoader.load à la place, cet avertissement devrait apparaître si vous utilisez une version un peu plus tard de trois js.

En outre, quel navigateur utilisez-vous? Je trouve que Firefox est généralement un peu plus généreux avec des textures d'affichage que Chrome par exemple. Cela a à voir avec la charge de l'image d'origine croisée et peut être un problème lorsque vous essayez d'exécuter votre code localement.