.addVectors() function not working

Questions
1

Hey all. I am New to three.js
I’ve written this small piece of code:
let assyCenter = new THREE.Vector3(0, 0, 0);

let oldCenter = new THREE.Vector3(1, 0, 0);

let unitVector = new THREE.Vector3().subVectors(oldCenter, assyCenter).normalize();

let distance = assyCenter.distanceTo(oldCenter);

let scaleFactor = 2;

let _i = 0;

let newCenter = new THREE.Vector3().addVectors(oldCenter, unitVector.multiplyScalar(distance * scaleFactor));

let _incrementVariable = 0.1;

let renderer = new THREE.WebGLRenderer();

let newCenterLoop = new THREE.Vector3();

renderer.setAnimationLoop(function () {

    if (_i < scaleFactor) {

        newCenterLoop.addVectors(oldCenter, unitVector.multiplyScalar(distance * _i));

        console.log(newCenterLoop);

        console.log(_i);

        _i = _i + _incrementVariable;

    }

    else {

        renderer.setAnimationLoop(null);

    }

});

But as you can see from the picture below the newCenterLoop isnt getting updated. I’ve included the jsFiddle as well: https://jsfiddle.net/PxyMeister/58kxwn4a/
(Its a silly a doubt. But I am new to three js and Programming in general)/

image
image691×592 17.7 KB

2

Hi!

After that line, your unitVector is not a unit vector anymore. Now it’s (2, 0, 0) instead of (1, 0, 0).
If you want to keep your unit vector length of 1 unit, then do something like that:
let newCenter = new THREE.Vector3().copy( oldCenter ).addScaledVector( unitVector, distance * scaleFactor ); ( though, I didn’t get what that line intended for originally)

And do the same thing in your animation loop
newCenterLoop.copy( oldCenter ).addScaledVector( unitVector, distance * _i );

1 Like
3

Thanks for the reply!