How can I make my FBX model rotate using animate function?

Question

I want to make my FBX model rotate continuously using three.js.

So I tried

1. make my object into variable
2. call my object in animate function to rotate. (girl1)

but I got an error:

Cannot read property 'rotation' of undefined.

My code is like this:

 function init() {... // zombie girl let loader_girl = new FBXLoader(); loader_girl.load("ZombiePunching.fbx", (object) => { // animation mixer mixer = new THREE.AnimationMixer(object); const action = mixer.clipAction(object.animations[0]); action.play(); // make materials opaque object.traverse((child) => { if (child.isMesh) { child.material.transparent = false; } }); object.scale.set(0.05, 0.05, 0.05); object.rotation.x = Math.PI; scene.add(object); girl1 = object; }); ... let loader = new THREE.TextureLoader(); loader.load("smoke.png", function (texture) { let cloudGeo = new THREE.PlaneBufferGeometry(500, 500); let cloudMaterial = new THREE.MeshLambertMaterial({ map: texture, transparent: true, }); for (let p = 0; p < 25; p++) { let cloud = new THREE.Mesh(cloudGeo, cloudMaterial); cloud.position.set( Math.random() * 800 - 400, 500, Math.random() * 500 - 450 ); cloud.rotation.x = 1.16; cloud.rotation.y = -0.12; cloud.rotation.z = Math.random() * 360; cloud.material.opacity = 0.6; cloudParticles.push(cloud); scene.add(cloud); } }); } function animate() { cloudParticles.forEach((p) => { p.rotation.z -= 0.002; }); rainGeo.vertices.forEach((p) => { p.velocity -= 0.1 + Math.random() * 0.1; py += p.velocity; if (py < -200) { py = 200; p.velocity = 0; } }); rainGeo.verticesNeedUpdate = true; rain.rotation.y += 0.002; girl1.rotation.y += 0.001; if (Math.random() > 0.93 || flash.power > 100) { if (flash.power < 100) flash.position.set(Math.random() * 400, 300 + Math.random() * 200, 100); flash.power = 50 + Math.random() * 500; } requestAnimationFrame(animate); renderer.render(scene, camera); } init(); animate();

Answer 1

Instead of doing this:

girl1.rotation.y += 0.001;

try it with:

if ( girl1 ) girl1.rotation.y += 0.001;

Since you start the animation loop before the FBX is actually loaded, girl1 will be undefined for a certain amount of time.