反应三纤维：旋转四面体"face down"

Question

我正在尝试旋转四面体，使其一侧朝下，就像放置在地板上的物理对象一样。

我希望这个SO答案能解决我的问题

通过赋予四面体applyMatrix属性来应用已接受的答案后，我的代码看起来像这样：

const Triangle = ({ position, color }) => {
const mesh = useRef(null);
return (
<mesh castShadow ref={mesh} position={position}>
<tetrahedronGeometry
attach="geometry"
args={[0.6, 0]}
applyMatrix={new THREE.Matrix4().makeRotationAxis(
new THREE.Vector3(2, 0, -1).normalize(),
Math.atan(Math.sqrt(2))
)}
/>
<meshStandardMaterial attach="material" color={color} />
</mesh>
);
};

然而，四面体的旋转并没有改变。我做错了什么？

这是我当前的代码：fiddle

Answer 1

applyMatrix是一个函数。你正在用矩阵覆盖它。本质上你在做这个：

const geom = new THREE.TetrahedronGeometry()
geom.applyMatrix = new THREE.Matrix4() 

在网格或几何体上放置一个ref，然后使用useLayoutEffect调用该函数。