Javascript 圆形和多边形之间的碰撞检测？

Question

当我有一个如下所示的多边形时，我不确定如何定义碰撞检测功能的区域:

    ______
   / _____|
  / /
 / /
---

在填充/描边调用之前，我使用 lineTo() 绘制了几次多边形，因此我知道所有点的 x,y 坐标。

目前我只是检查球是否超出点的某些区域:

    if(tmpParticle.y <= platformBottom) {
        if(tmpParticle.x < leftPipe_middleX || tmpParticle.x > rightPipe_middleX) {
            tmpParticle = particleCollision(tmpParticle, platformBottom);
        }
    }

    if(tmpParticle.y <= pipeBottom && tmpParticle.y >= pipeBottom - 30) {
        if(tmpParticle.x < leftPipe_bottomRightX && tmpParticle.x > leftPipe_bottomLeftX) {
            tmpParticle = particleCollision(tmpParticle, pipeBottom);
        } else if (tmpParticle.x < rightPipe_bottomRightX && tmpParticle.x > rightPipe_bottomLeftX) {
            tmpParticle = particleCollision(tmpParticle, pipeBottom);
        }
    }

platformHeight 是“顶部水平线”的 Y 值platformBottom 是“平台高度下方的水平线”的 Y 值rightPipe* 用于所示示例。 leftPipe* 适用于同一个多边形，除了另一个方向(形成一个管道，你必须将球射过而不发生碰撞)。

我的articleCollision()函数只接受tmpParticle并根据Y值(第二个参数，即pipeBottom)反转方向。虽然我以后可能需要改进它，但目前效果很好。

我只需要找到一种更好的方法来定义碰撞区域。

Answer 1

您可以考虑将管道分成三 Angular 形，然后找到三 Angular 形 - 圆形交叉区域。如果它们相交，交集将始终是一个凸多边形(通过再次分割成三 Angular 形很容易计算面积)和一个线段(面积也很容易计算 - http://en.wikipedia.org/wiki/Circular_segment )。另一种情况是三 Angular 形本身，如果它完全位于圆内(又是一个简单的情况)。