2017-09-08 8 views
0

J'utilise le chargeur obj + mtl pour charger mes fichiers OBJ dans ma scène. Dans mon fichier mtl, je charge mes textures.Three.js OBJ MTL Loader non visible sur IOS

.: par exemple

newmtl initialShadingGroup 
illum 4 
Kd 1.00 1.00 1.00 
Ka 0.00 0.00 0.00 
Tf 1.00 1.00 1.00 
map_Kd 6922529901031.jpg 
map_Bump 6922529901031_bump.jpg 
Ni 1.00 

Tout fonctionne bien sur tous les systèmes, à l'exception de l'IOS mobile. Sur ces appareils, les fichiers ayant une texture ou une carte d'environnement ne s'affichent pas du tout. Juste les ombres.

Ce que j'essayé jusqu'à présent:

  • Vérification des textures d'être une puissance de 2.

  • mis l'ombrage à double face

  • contrôle la taille des fichiers (tout ci-dessous 200kb

Lorsque j'utilise l'inspecteur web i obtenir cette erreur:

[Error] THREE.WebGLProgram: shader error: (7) 
1282 
"gl.VALIDATE_STATUS" 
false 
"gl.getProgramInfoLog" 
"" 
"" 
"" 

Voici mon chargeur:

function loadMesh(objTxt, mtlTxt) { 

var onProgress = function (xhr) { 
    if (xhr.lengthComputable) { 
    } 
}; 
var onError = function (xhr) { }; 

var mtlLoader = new THREE.MTLLoader(); 
mtlLoader.setTexturePath('assets/'); 
mtlLoader.setPath('assets/'); 
mtlLoader.load(mtlTxt, function(materials) { 

    materials.preload(); 
    if(materials.materials['initialShadingGroup']['map'] != null) { 
     materials.materials['initialShadingGroup']['map']['magFilter'] = THREE.NearestFilter; 
     materials.materials['initialShadingGroup']['map']['minFilter'] = THREE.LinearFilter; 
    } 

    /*set environment map*/ 
    materials.materials['initialShadingGroup']['envMap'] = new THREE.CubeTextureLoader().load([ 'img/posx.jpg', 'img/negx.jpg', 'img/posy.jpg', 'img/negy.jpg', 'img/posz.jpg', 'img/negz.jpg' ]); 
    /*set reflectivity of material*/ 
    materials.materials['initialShadingGroup']['reflectivity'] = 1.0; 
    /*set anisotropy of bumpMap*/ 
    if(materials.materials['initialShadingGroup']['bumpMap'] != null) { 
     materials.materials['initialShadingGroup']['bumpMap']['anisotropy'] = 16; 
    } 

    if(materials.materials['initialShadingGroup']['specularMap'] != null) { 
     materials.materials['initialShadingGroup']['specularMap']['anisotropy'] = 16; 
    } 
    materials.materials['initialShadingGroup']['bumpScale'] = 0.1; 

    var objLoader = new THREE.OBJLoader(); 
    objLoader.setMaterials(materials); 
    objLoader.setPath('assets/'); 
    objLoader.load(objTxt, function (object) { 


     /*set attributes of OBJ childs*/ 
     object.traverse(function(node) { if (node instanceof THREE.Mesh) { 

      node.castShadow = true; 
      node.receiveShadow = true; 

      node.material.shading = THREE.SmoothShading; 
     } }); 



     scene.add(object); 



    }, onProgress, onError); 

}); 
} 

Répondre

0

Je fini par comprendre moi-même. Pour tous ceux qui s'intéressent à ma solution: je suis passé de OBJLoader à OBJLoader2, plus récent.

var objLoader = new THREE.OBJLoader2(); 

J'ai aussi se sont débarrassés de la fonctionnalité de recevoir des ombres:

node.receiveShadow = false; 

Enfin apparaissent mes objets, et je peux vivre avec le fait, ce qu'aucune ombre ne sera reçue sur Iphone et Ipad