Я новичок в 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-модели на сцене.
'loader.load()' является асинхронным. Вот почему у вас есть функция обратного вызова. Вы выполняете рендеринг до загрузки модели. – WestLangley
@WestLangley Спасибо за объяснение, как это работает. – Moonbeam