Search code examples
javascriptvectorthree.jsplane

How to use Three.js plane


I'm trying to use three.js plane to get the distance from a point to a plane.

I have three points a,b,c, that I calculate the normal like so:

    const v = a.clone().sub(c);
    const u = b.clone().sub(c);
    const normal = u.cross(v);

Then

const plane = new THREE.Plane(normal, (?))

What are you supposed to give in the second argument?

From the docs:

the negative distance from the origin to the plane along the normal vector. Default is 0.

What does that mean?

If I place there the distance of one of the points a,b,c to (0,0,0) (positive and negative distance), like const dist = a.distanceTo(new THREE.Vector3(0,0,0)), then if I do:

plane.distanceToPoint(a); 

I'm getting a huge number and not zero, the same happens if I leave that argument empty.

So how can I place that plane at its correct place so that the distance to points on that plane will be zero as it should?


Solution

  • As you have three coplanar points, you can use .setFromCoplanarPoints(a, b, c) method of THREE.Plane().

    An example of using it is in this SO answer.