圈和多边形之间的Javascript碰撞检测?

时间:2013-05-08 12:13:31

标签: javascript math collision-detection

当我有一个看起来如下的多边形时,我不确定如何定义碰撞检测功能的区域:

    ______
   / _____|
  / /
 / /
---

我在填充/描边调用之前使用lineTo()几次绘制多边形,所以我知道所有点的x,y co-ords。

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

    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将是“platformHeight下面的水平线”的Y值 rightPipe *用于显示的示例。 leftPipe *用于相同的多边形,除了在另一个方向上(形成一个管道,你必须在没有碰撞的情况下射击球)。

我的particleCollision()函数只接受tmpParticle,并根据Y值(第二个参数,即pipeBottom)反转方向。这虽然现在可以正常工作,但我可能需要稍后改进它。

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

1 个答案:

答案 0 :(得分:0)

您可以考虑将管道拆分为三角形,然后找到triangle - circle交叉区域。如果它们相交,那么交点总是convex polygon(区域很容易通过再次分成三角形来计算)和segment(区域也很容易计算 - http://en.wikipedia.org/wiki/Circular_segment)。另一种情况是三角形本身,如果它完全位于圆圈内(再次是一个简单的情况)。