Как добавить 3D модель через Three JS?

Question

[paradox228]

Всем привет. Недавно изучаю Three JS и в попытках добавить ранее загруженную модель из интернета получаю ошибку

three.js:7125 Uncaught TypeError: Cannot convert undefined or null to object
    at Function.keys (<anonymous>)
    at Mesh.updateMorphTargets (three.js:7125:24)
    at new Mesh (three.js:7108:9)
    at script.js:23:17

вот js:

import * as TREE from '/js/three.js';
import {GLTFLoader} from '/js/examples/jsm/loaders/GLTFLoader.js';
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );

const renderer = new THREE.WebGLRenderer();
renderer.setSize( window.innerWidth, window.innerHeight );
document.body.appendChild( renderer.domElement );

const loader = new GLTFLoader();

loader.load( "model.glb", function(gltf){
	scene.add(gltf.scene);
}, undefined, function ( error ) {
	console.error( error );
} );

const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
const model = new THREE.Mesh( loader, material );
scene.add(model);
camera.position.z = 5;
function animate() {
	requestAnimationFrame(animate);
	model.rotation.x += 0.01;
	model.rotation.y += 0.01;
	renderer.render(scene, camera);
};
animate();

Answer 1

[Ivan Bogachev]

Хорошо бы, конечно, иметь полный рабочий пример, чтобы посмотреть. Но по коду кажется, что вы уже добавили загруженный объект на сцену вот тут:

scene.add(gltf.scene);

Этого должно быть достаточно. Так что то, что там дальше:

const model = new THREE.Mesh( loader, material );
scene.add(model);

Уже не нужно. Не говоря уже о том, что этот код - полная бессмыслица. Mesh создается из геометрии и материала, а вы туда вместо геометрии что-то другое передаете. Отсюда должна быть ошибка.