Three.js 2D 对象与 raycaster 碰撞

Question

我正在尝试检测平面上两个 2D 对象(例如，两个 THREE.CircleGeometry)的碰撞。

我的问题:有没有推荐的方法来检测二维物体碰撞？ 我在下面有 2 次尝试，但它们都不好。如果有人以前有这方面的经验，请您帮忙吗？先感谢您。

这是我的第一次尝试:

//'player' is the Circle that I'm controlling. In the scene, there is another position-fixed circle, called 'target'.
// I hope to cast a ray from player to the target and detect collision.
// 'mouse' is a normalized direction THREE.Vector3()

raycaster.set(player.position, mouse);
var intersects = raycaster.intersectObjects( scene.children );
for ( var i = 0; i < intersects.length; i++ ) {
    console.log("TEST");
    intersects[ i ].object.material.color.set( 0xff0000 );
}

显然那没有用。我已经意识到 raycaster 似乎不适用于 2D 对象。 (我用 3D 对象进行了测试，效果很好)。

这是第二次尝试:

var dis = distance(target.position, player.position);
if (dis < 1) {
target.material.color.set(0xff0000);
}

此方法 作品 我可以检测到两个圆圈之间的碰撞:玩家和目标。 然而 ，它真的导致 性能不佳 ，因为绝对没有必要为每个 render() 检查数千个目标。

如果有人有任何想法或任何推荐的阅读，你会建议吗？我尝试在线搜索，但大多数教程和示例都是针对 3D 碰撞的。提前致谢。

Answer 1

我知道这是一个旧帖子，但也许其他人需要。

我推荐您提议的第二种方法，但使用圆圈的子集。

在一个假设的 map 中，你有 1000000 个障碍，当然，如果你检查每个障碍的碰撞，你会在几年后结束，但是如果你在 map 上有一个网格，并将这个圆圈放在对应位置的单元格中，您可以只比较玩家周围的圆圈，只比较玩家占据的单元格的圆圈。

如果您对此圆圈进行简单的碰撞验证，那么这种方式很快。