2015-11-23 4 views
0

Je suis nouveau avec WebGL et Three.js. J'essaie d'importer un simple modèle 3D que j'ai créé dans Blender et enregistrer sous .dae. Je suis en train de tester localement avec le serveur http Python. La couleur d'arrière-plan est correcte, mais je ne peux pas afficher mon modèle 3D sur la scène. Dans Chrome, je vois l'erreur dans la console:ThreeJS n'affiche pas dae modèle 3D

Uncaught TypeError: THREE.UV is not a function - ColladaLoader.js:2413 
Mesh.handlePrimitive @ ColladaLoader.js:2413 
Mesh.parse @ ColladaLoader.js:2317 
Geometry.parse @ ColladaLoader.js:2233 
parseLib @ ColladaLoader.js:235 
parse @ ColladaLoader.js:130 
req.onreadystatechange @ ColladaLoader.js:73 

<html> 
 
<head> 
 
    <title>3D object.js</title> 
 
</head> 
 
<body> 
 
<script src="js/three.min.js"></script> 
 
<script src="js/ColladaLoader.js"></script> 
 
<script> 
 

 
    var renderer = new THREE.WebGLRenderer(); 
 
    renderer.setSize(800, 600); 
 
    document.body.appendChild(renderer.domElement); 
 

 
    var scene = new THREE.Scene(); 
 

 
    var camera = new THREE.PerspectiveCamera(
 
      35,    // Field of view 
 
      800/600,  // Aspect ratio 
 
      0.1,   // Near plane 
 
      1000   // Far plane 
 
    ); 
 

 
    camera.position.set(-15, 1000, 10); 
 
    camera.lookAt(scene.position); 
 

 
    var loader = new THREE.ColladaLoader(); 
 
    loader.options.convertUpAxis = true; 
 
    loader.load('models/MyModel.dae', function(collada) { 
 
     var dae = collada.scene; 
 
     var skin = collada.skins[0]; 
 
     dae.position.set(0,0,0); 
 
     dae.scale.set(1,1,1); 
 
     scene.add(dae); 
 
    }); 
 

 
    var dirLight = new THREE.DirectionalLight(0xffffff, 1); 
 
    dirLight.position.set(100, 100, 50); 
 
    scene.add(dirLight); 
 

 
    Render(); 
 

 
    function Render() { 
 
     renderer.setClearColor(0xffe5e5, 1); 
 
     renderer.render(scene, camera); 
 
    } 
 
</script> 
 
</body> 
 

 
</html>

Quelqu'un peut-il me donner une idée de ce qu'il faut faire? Je passe déjà des heures à essayer de trouver une solution sans succès.

EDIT: J'ai téléchargé un autre ColladaLoader.js et maintenant je n'ai plus d'erreur. Mais je ne vois toujours pas de modèle 3D sur la scène.

+0

'loader.load()' est asynchrone. C'est pourquoi vous avez une fonction de rappel. Vous effectuez le rendu avant le chargement du modèle. – WestLangley

+0

@WestLangley Merci pour l'explication comment cela fonctionne. – Moonbeam

Répondre

0

On dirait que vous ne faites que rendre la scène une seule fois. manquant requestAnimationFrame (Func) sur votre fonction rendre

Regardez sous "la scène de rendu" http://threejs.org/docs/#Manual/Introduction/Creating_a_scene

+0

@WestLangley merci! J'ai ajouté requestAnimationFrame (render); à ma fonction Render() et maintenant je vois mon modèle sur la scène. – Moonbeam