2015-11-23 4 views
0

Я новичок в WebGL и Three.js. Я пытаюсь импортировать простую 3D-модель, которую я создал в Blender, и сохранить как .dae. Я тестирую локально с помощью HTTP-сервера Python. Цвет фона в порядке, но я не могу отобразить свою 3D-модель на сцене. В Chrome я вижу ошибку в консоли:ThreeJS не отображает dae 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>

Может кто-нибудь дать мне какие-либо идеи, что делать? Я уже часами пытаюсь найти решение без успеха.

EDIT: Я загрузил еще один ColladaLoader.js, и теперь у меня больше нет ошибок. Но все же я не вижу 3D-модели на сцене.

+0

'loader.load()' является асинхронным. Вот почему у вас есть функция обратного вызова. Вы выполняете рендеринг до загрузки модели. – WestLangley

+0

@WestLangley Спасибо за объяснение, как это работает. – Moonbeam

ответ

0

Похоже, что вы только визуализируете сцену один раз. Отсутствует requestAnimationFrame (Func) на вашей визуализации функции

Посмотрите в разделе "Визуализация сцены" http://threejs.org/docs/#Manual/Introduction/Creating_a_scene

+0

@WestLangley спасибо! Я добавил requestAnimationFrame (рендеринг); к моей функции Render(), и теперь я вижу свою модель на сцене. – Moonbeam

Смежные вопросы