Move mesh from one model to another?

Questions
, ,
1

So i have a box and 2 models lets say:

model 1 is at

position.x= -10;
position.z = 40;

and model 2 is at

position.x = 50;
position.z = -20;

to start with (this position changes though as its a moving character, both models move)

now i want the box’s position to start at the same position as model 1 so:

box.position.x = model1.position.x;
      box.position.z = model1.position.z;

All good so far but how would i animate the box to model 2’s position?

tween and gsap solutions welcome thanks

2

Maybe like so: three.js dev template - module - JSFiddle - Code Playground

1 Like
3

thanks for the reply i ended up doing this:

     
          function animateVector3(vectorToAnimate, targetz, options){
    options = options || {};
    
    var to = targetz || THREE.Vector3(),
        easing = options.easing || TWEEN.Easing.Quadratic.In,
        duration = options.duration || 1000;
    
    var tweenVector3 = new TWEEN.Tween(vectorToAnimate)
        .to({ x: to.x, y: to.y, z: to.z, }, duration)
        .easing(easing)
        .onUpdate(function(d) {
            if(options.update){ 
                options.update(d);
            }
         })
        .onComplete(function(){
          if(options.callback) options.callback();
        });
    
    tweenVector3.start();
    return tweenVector3;
}
          
          var targetz = new THREE.Vector3(xP, 6.5, zP); 
animateVector3(actionSprite2.position, targetz, {
    
    duration: 1000, 
    
    easing : TWEEN.Easing.Quadratic.InOut,
    
    update: function(d) {
        console.log("Updating: " + d);
    },
    
    callback : function(){
        console.log("Completed");
    }
});