一条线,在JavaScript中的圆圈之间的碰撞检测(Collision detection bet

2019-06-25 09:25发布

我在寻找一个明确的答案,也许一个函数因为我是缓慢的,将确定一个线段和圈发生了冲突,在JavaScript(用帆布工作)

象下面这样的一个函数只是如果发生碰撞或假,如果不将真棒返回true。 我甚至可能会捐一个孩子给你。

function isCollided(lineP1x, lineP1y, lineP2x, lineP2y, circlex, circley, radius) {

    ...
}

我发现很多公式, 像这样的 ,但他们是在我的头上。

Answer 1:

在这里,您将需要一些数学:

这是基本的概念,如果你不知道如何解决方程一般。 我会留更多的思考的其余部分给你。 )搞清楚CD的长度并不难。

如果你问怎么了,这是怎么样: 发现在JavaScript中的碰撞是一种复杂的。



Answer 2:

我用了大约一天半的时间,使之完美..希望这会有所帮助。

function collisionCircleLine(circle,line){ // Both are objects

    var side1 = Math.sqrt(Math.pow(circle.x - line.p1.x,2) + Math.pow(circle.y - line.p1.y,2)); // Thats the pythagoras theoram If I can spell it right

    var side2 = Math.sqrt(Math.pow(circle.x - line.p2.x,2) + Math.pow(circle.y - line.p2.y,2));

    var base = Math.sqrt(Math.pow(line.p2.x - line.p1.x,2) + Math.pow(line.p2.y - line.p1.y,2));

    if(circle.radius > side1 || circle.radius > side2)
        return true;

    var angle1 = Math.atan2( line.p2.x - line.p1.x, line.p2.y - line.p1.y ) - Math.atan2( circle.x - line.p1.x, circle.y - line.p1.y ); // Some complicated Math

    var angle2 = Math.atan2( line.p1.x - line.p2.x, line.p1.y - line.p2.y ) - Math.atan2( circle.x - line.p2.x, circle.y - line.p2.y ); // Some complicated Math again

    if(angle1 > Math.PI / 2 || angle2 > Math.PI / 2) // Making sure if any angle is an obtuse one and Math.PI / 2 = 90 deg
        return false;


        // Now if none are true then

        var semiperimeter = (side1 + side2 + base) / 2;

        var areaOfTriangle = Math.sqrt( semiperimeter * (semiperimeter - side1) * (semiperimeter - side2) * (semiperimeter - base) ); // Heron's formula for the area

        var height = 2*areaOfTriangle/base;

        if( height < circle.radius )
            return true;
        else
            return false;

}

这是你怎么做..



Answer 3:

马特DesLauriers发表了Javascript库在这个问题https://www.npmjs.com/package/line-circle-collision 。 该API很简单:

var circle = [5, 5],
    radius = 25,
    a = [5, 6],
    b = [10, 10]

var hit = collide(a, b, circle, radius)


文章来源: Collision detection between a line and a circle in JavaScript