Move vector3 along normal (vector math help)

Questions
1

I was hoping someone could help me out with some vector math in three.js

Say I had 3 Vector3 points, A, B, C, which form a plane called ABC.
I would like to move point B by 10 units, along a vector that is perpendicular to the vector AC, and sits on the plane ABC.

How would I go about doing that in three?

05%20am
Screen Shot 2019-10-17 at 10.10.05 am.png816Ă—684 5.68 KB

2

How about projecting B on the line segment AC and then compute a direction vector from the projected point to B. Something like this:

const A = new THREE.Vector3( 1, 0, 0 );
const B = new THREE.Vector3( 0, 1, 0 );
const C = new THREE.Vector3( - 1, 0, 0 );

const B_ON_AC = new THREE.Vector3();
const direction = new THREE.Vector3();

const lineSegment = new THREE.Line3( A, C );
lineSegment.closestPointToPoint( B, true, B_ON_AC );

direction.subVectors( B, B_ON_AC ).normalize();
B.add( direction.multiplyScalar( 10 ) );

Live demo: https://jsfiddle.net/0eb21kvs/

5 Likes
3

As far as I can tell that does the trick! Thanks!

4

Unfortunately it doesn’t appear to work with the following example

const A = new THREE.Vector3( 100, -149, 0 );
const B = new THREE.Vector3( 100, -148, 0 );
const C = new THREE.Vector3( 100, -146, 0 );

returns

{x: 100, y: -148, z: 0}

I would expect x to be 90 or 110

Looks like it’s because you can’t form a plane when everything aligns. I suppose maybe I could hack something together there by temporarily moving the middle point.

5

The problem is that’s a degenerate triangle - all points are on the same line.

I suppose maybe I could hack something together there by temporarily moving the middle point.

You could subtract a tiny value from A.x and B.x:

const eps = 0.0000000000001;

if( degenerate ) {
    A.x = A.x - epsilon;
    B.x = B.x - epsilon;
}

Then your answer will be (89.9999999999999, -148, 0).

However, you have to make choices: + or - eps, and which axis (x or z in this case) to subtract from.

2 Likes