Cannon.js -如何防止对象在更新时裁剪“地板”

Question

我将Cannon.js与Three.js结合使用。

我创造了一个由一个高场和五个球组成的场景。我要用cannon.js物理方法，把球绕着高场滚动。

鼠标移动时，我沿着y轴旋转高度场，使球体来回滚动。

我有一个update循环，它从cannon.js复制球面位置&四元数，并应用于three.js的可视范围。高度场也在three.js视觉地板的同时更新。这两种方法都在requestAnimationFrame中的for循环中运行。

updateMeshPositions() {

    for (var i = 0; i !== this.meshes.length; i++) {
        this.meshes[i].position.copy(this.bodies[i].position);
        this.meshes[i].quaternion.copy(this.bodies[i].quaternion);

        this.hfBody.position.copy(this.mesh.position);
        this.hfBody.quaternion.copy(this.mesh.quaternion);
    }
}

然而，问题是当“地板”来回旋转时，球体会被卡住，有时甚至会从地板上掉下来。下面是一个关于codepen - https://codepen.io/danlong/pen/qJwMBo的示例

在屏幕上上下移动鼠标以查看此操作。

在保持球体运动的同时，是否有更好的或不同的方法来旋转‘地板’？

Answer 1

在包括cannon.js在内的所有物理引擎中，直接(即“立即”)设置位置/旋转很可能会破坏碰撞处理。实际上，你是通过空间传送东西，导致物体被困在或通过对方。

你应该做的是

• 设定速度( .velocity和.angularVelocity)或向Cannon.js物体施加力
• 将这些身体的转换复制到您的可视化网格中(注意到这正是您当前在代码中所做的事情的反面)。

确定合适的作用力量以获得理想的视觉行为通常是一个棘手的部分。