Rotation de boucle sur n'importe quel axe pour un obj 3D Trois js

Question

J'essaie de faire un objet 3d importé pour tourner en continu sur n'importe quel axe comme un cube classique, sphère etc. Mais ça ne marche pas, ne bouge pas du tout et Je ne comprends pas pourquoi. Voici le code:

var scene6, camera6, renderer6, light, shipMtl, shipObj; 

function init() { 
    scene6 = new THREE.Scene(); 
    camera6 = new THREE.PerspectiveCamera(35, 1, 1, 1000); 
    camera6.position.z = 400; 

    //LIGHTS 
    light = new THREE.PointLight(0xffffff, 2, 0); 
    light.position.set(200, 100, 300); 
    scene6.add(light); 


    //3D MODEL 
    shipMtl = new THREE.MTLLoader(); 
    shipMtl.load('../models/spaceCraft1.mtl', function(materials) { 
     materials.preload(); 
     shipObj = new THREE.OBJLoader(); 
     shipObj.setMaterials(materials); 
     shipObj.load('../models/spaceCraft1.obj', function(object) { 
      object.scale.set(10, 10, 10); 
      object.rotation.x += .01; 
      scene6.add(object); 
     }); 
    }); 

    renderer6 = new THREE.WebGLRenderer({ canvas: document.getElementById('model'), antialias: true }); 
    renderer6.setClearColor(0x000000); 
    renderer6.setPixelRatio(window.devicePixelRatio); 

    animate6(); 
} 

function animate6() { 

    requestAnimationFrame(animate6); 
    renderer6.render(scene6, camera6); 

} 

window.onload = init; 

Nous vous remercions de votre aide.

Answer 1

La rotation de votre objet n'est modifiée qu'une seule fois: lorsque le modèle est chargé.

Si vous souhaitez le faire pivoter en continu, vous devez mettre à jour sa rotation chaque image. Par conséquent, vous devez déplacer la ligne object.rotation.x += 0.01 à l'intérieur de la fonction animate().

var scene6, camera6, renderer6, light, shipMtl, shipObj; 
var obj; // global reference to your model, once loaded 

function init() { 
    scene6 = new THREE.Scene(); 
    camera6 = new THREE.PerspectiveCamera(35, 1, 1, 1000); 
    camera6.position.z = 400; 

    //LIGHTS 
    light = new THREE.PointLight(0xffffff, 2, 0); 
    light.position.set(200, 100, 300); 
    scene6.add(light); 

    //3D MODEL 
    shipMtl = new THREE.MTLLoader(); 
    shipMtl.load('../models/spaceCraft1.mtl', function(materials) { 
     materials.preload(); 
     shipObj = new THREE.OBJLoader(); 
     shipObj.setMaterials(materials); 
     shipObj.load('../models/spaceCraft1.obj', function(object) { 
      object.scale.set(10, 10, 10); 
      // no need to change the rotation here 
      obj = object; // put your object as global 
      scene6.add(object); 
     }); 
    }); 

    renderer6 = new THREE.WebGLRenderer({ canvas: document.getElementById('model'), antialias: true }); 
    renderer6.setClearColor(0x000000); 
    renderer6.setPixelRatio(window.devicePixelRatio); 

    animate6(); 
} 

function animate6() { 
    requestAnimationFrame(animate6); 

    obj.rotation.x += 0.01; 

    renderer6.render(scene6, camera6); 
} 

window.onload = init;