得到面部旋转Three.js

Question

我正在点击鼠标点击这样的Three.js的交叉点

me.vector.set(
    (event.clientX / window.innerWidth) * 2 - 1,
    -(event.clientY / window.innerHeight) * 2 + 1,
    0.5);
me.vector.unproject(app.camera);
me.ray.set(app.camera.position, me.vector.sub(app.camera.position).normalize());
var intersects = me.ray.intersectObjects(app.colliders, false);

所以，我得到了完美的交叉，具有以下属性：

distance, face, faceIndex, object, point，然后我执行一个函数。

问题如下：

我想检测当我点击一个立方体的脸，就像一个地板，在下一个例子中将是灰色的脸。

抱歉我的工程师D：

Answer 1

WebGL使用坐标，颜色和法线定义顶点和面。面法线是垂直于面平面的标准化矢量（并且通常指向网格外部）。它定义了它的方向并能够计算闪电。在three.js中，您可以通过face.normal访问它。

• 如果你的地板面是严格水平的，那么它们的法线都是{x:0,y:1,z:0}。由于法线规范化，只需检查face.normal.y === 1是否也检查x和y是否等于0.

• 如果您的面部不是严格水平的，则可能需要设置y轴的限制角度。您可以使用var angle=Math.acos(Yaxis.dot(faceNormal)) Yaxis=new THREE.Vector3(0,1,0)。

计算此角度