TrackballControls avec Collada kfAnimation Three JS

Question

Salut les gars, je travaille avec l'animation kfAnimation à partir d'un modèle Collada. Je veux inclure un contrôle de la boule de commande mais quand je je dépasse la pile de la taille, je ne sais pas pourquoi mon code est le suivant

 function init() { 

        initRender(); 
        // Camera 
        initCamera(); 
        // Scene 
        initScene(); 
        //controlls 
        initControls(); 

        initGrid(); 

        loadObjectAnimatedFrames(); 


        window.addEventListener('resize', onWindowResize, false); 
       } 
    function loadObjectAnimatedFrames(){ 
        loader = loader.load('sources/crack-animated.dae', function (collada) { 
        model = collada.scene; 
        animations = collada.animations; 
        kfAnimationsLength = animations.length; 
        //model.scale.x = model.scale.y = model.scale.z = 0.125; // 1/8 scale, modeled in cm 

        for (var i = 0; i < kfAnimationsLength; ++i) { 
         var animation = animations[ i ]; 
         var kfAnimation = new THREE.KeyFrameAnimation(animation); 
         kfAnimation.timeScale = 1; 
         kfAnimations.push(kfAnimation); 
        } 
        start(); 
        animate(lastTimestamp); 
        scene.add(model); 
        }); 
       } 
    function initControls(){ 

        controls = new THREE.TrackballControls(camera); 
        controls.minDistance = 100; 
        controls.maxDistance = 1800; 
        controls.addEventListener('change',render); 

        } 
function animate(timestamp) { 
       var frameTime = (timestamp - lastTimestamp) * 0.001; 
       if (progress >= 0 && progress < 48) { 
        for (var i = 0; i < kfAnimationsLength; ++i) { 
         kfAnimations[ i ].update(frameTime); 
        } 
       } else if (progress >= 48) { 
        for (var i = 0; i < kfAnimationsLength; ++i) { 
         kfAnimations[ i ].stop(); 
        } 
        progress = 0; 
        start(); 
       } 
       //pointLight.position.copy(camera.position); 
       progress += frameTime; 
       lastTimestamp = timestamp; 

       render(); 

      } 

J'ai essayé de mettre des contrôles mise à jour à l'intérieur Animer et lancer la fonction mais je pense qu'il consommait beaucoup des ressources. J'ai aussi essayé de mettre à l'intérieur du rendu mais les mêmes résultats.

Merci pour votre aide j'espère que d'autres expérimentés peuvent m'aider.

Answer 1

Enfin, je trouve la solution et il était une option enableDamping et dampingFactor

function initControls(){ 
       controls = new THREE.TrackballControls(camera, renderer.domElement); 
       //controls.addEventListener('change', render); // add this only if there is no animation loop (requestAnimationFrame) 
       controls.enableDamping = true; 
       controls.dampingFactor = 0.25; 
       controls.enableZoom = false; 
      } 

après cela, je viens d'ajouter controls.update();

renderer.render(scene, camera); 
      requestAnimationFrame(animate);