从两个单独的对象在 Three.JS 中对齐人脸 [英] Issue aligning faces in Three.JS from two seperate objects

问题描述

我的 Three.js 代码有问题.

I'm having an issue in my three.js code.

我试图通过选择两个面来对齐两个对象，并使第二个面(和对象)旋转以匹配第一个对象所选面的法线向量.

I am trying to align two objects by selecting two faces and have the second face (and object) rotate to match the normal vector of the first object's selected face.

到目前为止我有:

var normalMatrix = new THREE.Matrix3().getNormalMatrix( object.matrixWorld );
var worldNormal = face.normal.clone().applyMatrix3( normalMatrix ).normalize();
var normalMatrixRef = new THREE.Matrix3().getNormalMatrix( objectRef.matrixWorld );
var worldNormalRef = faceRef.normal.clone().applyMatrix3( normalMatrixRef).normalize();

其中:object 是我将要旋转的对象，face 是该对象的选定面，objectRef 是静止对象参考，faceRef 是我要匹配的对象的法线.

where: object is my object that will be rotated, face is the selected face of that object, objectRef is the stationary object reference and faceRef is the normal of the object I want to match.

在做之前

  object.lookAt(worldNormalRef);

，我正在尝试

object.up = new THREE.Vector3(0,0,1); 
object.up = worldNormal;
object.up = face.normal; 

两者都不起作用.

object.up 的任何一个案例都无法正常工作.当我执行此操作时，目标对象(要旋转的对象)确实会旋转，但不会正确对齐面.它是任意的，但以某种方式与对象当前的旋转相关联(即:有时它沿 (0,1,0) 或类似方向旋转，有时如果我预旋转对象，它只会稍微旋转一点.

Either object.up cases are not working as they should. When I do the action, the target object (the one to be rotated) does rotate, but does not align the faces correctly. It is arbitrary but somehow is linked to objects current rotation (ie: sometimes it rotates along (0,1,0) or simliar, othertimes if I pre-rotate the object it just rotates a slight bit.

理论上，lookAt 使用了我的 faceRef 所在的世界向量，只要我正确设置了向上"，它应该可以工作，但不会.

In theory lookAt uses a world vector which my faceRef is, and as long as I set the 'up' correctly, it should work but it dosen't.

有什么想法吗?

推荐答案

我在我的代码中发现了这个问题，我希望它可以在将来对某人有所帮助.

I found the issue in my code, I hope it can help somebody in the future. The

object.lookAt(worldNormalRef); 

需要修改以将新的面法线添加到当前对象的位置，以便 lookAt 正常运行:

needs instead to be modified to add the new face normals to the current object's postition for the lookAt to function correctly:

//create a point to lookAt
var newPoint = new THREE.Vector3(
    object.position.x + worldNormalRef.x,
    object.position.y + worldNormalRef.y,
    object.position.z + worldNormalRef.z
);

object.up = face.normal;//Z axis up
object.lookAt(newPoint ); 

还要注意，object.up应该像上面一样设置为face.normal(我想对齐参考对象的人脸)，而不是上面设置的worldNormal(我会删除这部分代码).

Also note that the object.up should be set as above to the face.normal (the face I want to align to the reference object's face), and not to the worldNormal set above (I will delete this part of my code).

这篇关于从两个单独的对象在 Three.JS 中对齐人脸的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！