For school I need to make a program in JavaScript that says if circles had a collision.

It doesn't need to be shown graphically.

I gave it a try, but my code doesn't seem to work. How can I fix it?

Here's the code I produced:

function collision (p1x, p1y, r1, p2x, p2y, r2) {
    var a;
    var x;
    var y;

    a = r1 + r2;
    x = p1x - p2x;
    y = p1y - p2y;

    if (a > (x*x) + (y*y)) {
        return true;
    } else {
        return false;
    }
}
var collision = collision(5, 500, 10, 1000, 1500, 1500);
alert(collision);

For school I need to make a program in JavaScript that says if circles had a collision.

It doesn't need to be shown graphically.

I gave it a try, but my code doesn't seem to work. How can I fix it?

Here's the code I produced:

function collision (p1x, p1y, r1, p2x, p2y, r2) {
    var a;
    var x;
    var y;

    a = r1 + r2;
    x = p1x - p2x;
    y = p1y - p2y;

    if (a > (x*x) + (y*y)) {
        return true;
    } else {
        return false;
    }
}
var collision = collision(5, 500, 10, 1000, 1500, 1500);
alert(collision);

• javascript
• detection
• geometry

• 2 Aren't you missing something in your formulae here? – Jørgen Commented Nov 30, 2011 at 18:54
• And you can change your return statement to just return (a > (x*x) + (y*y)); Rather than using an if to return true or false, since that's what the condition already is. Or better, store the condition in a variable named var isCollision = (a > (x*x) + (y*y)); and return isCollision; It just makes it easier to read. And don't reuse variable names like collision for two things. – CaffGeek Commented Nov 30, 2011 at 18:55
• Reread the distance forumula. You've almost got it, but there's a part missing. – Nate B Commented Nov 30, 2011 at 18:57
• A good way to debug issues is to step through the code. – John Kane Commented Nov 30, 2011 at 18:59

3 Answers 3

Your check should be if (a > Math.sqrt((x*x) + (y*y))) http://cgp.wikidot.com/circle-to-circle-collision-detection

So the complete code is

function collision(p1x, p1y, r1, p2x, p2y, r2) {
  var a;
  var x;
  var y;

  a = r1 + r2;
  x = p1x - p2x;
  y = p1y - p2y;

  if (a > Math.sqrt((x * x) + (y * y))) {
    return true;
  } else {
    return false;
  }
}
var collision = collision(5, 500, 10, 1000, 1500, 1500);
console.log(collision);

and for a less computational implementation (using ES7 syntax for the snippet) use

const checkCollision = (p1x, p1y, r1, p2x, p2y, r2) => ((r1 + r2) ** 2 > (p1x - p2x) ** 2 + (p1y - p2y) ** 2)

var collision = checkCollision(5, 500, 10, 1000, 1500, 1500);
console.log(collision);

as Darek Rossman shows in his answer.

In your if statement, try this instead:

if ( a * a > (x * x + y * y) ) {
    ...
} else {
    ...
}

The length of a triangle having sides dx and dy (i.e. the distance between points (x1, y1) and (x2, y2) where dx = x2 - x1 and dy = y2 - y1) is equal to:

sqrt(dx^2 + dy^2)

So you probably want:

if(a > Math.sqrt(x*x + y*y)) {