[answered] 2D Collision Detection Advice

[Woland]

Hello all,

I'm working on a project in which I'm going to be simulating some 2D arcade games within Isadora.

Going into it, I was wondering if anyone has any advice that could save me some headaches in terms of collision detection (such as detecting when an enemy collides with the player, when a projectile hits an enemy, etc.) 

I've worked on something similar before (checkers + chess), but the big difference is that the games I worked on before were turn-based and with specific quadrants, whereas these new games have to have the collision detection with multiple objects that are in motion. With chess, I only needed to check whether a piece could legally move to a square and, if an opponent's piece was there, destroy the piece. With arcade games, I need to constantly check the location of every enemy against the location of the player and the player's projectiles, as well as constantly checking the location of the enemy projectiles against the player, meaning I need to isolate each moving part and be able to tell when they collide visually (which is quite a bit more complex than comparing static locations on a grid). 

Any thoughts?

Best wishes,

Woland

[GertjanB]

Hi,

I don't find it immediately but I have made something where a video would go on if someone is close to an object, with video in Isadora.
I only worked with circles because that was easier.

I did it with mathematics in javascript. if pont A is inside the radius around point B it would trigger. 

I'll keep looking if I can find it again.

EDIT:

Found it: I worked with the distance between the 2 points. If the distance =< than the combined radiuses of the two cicles they collide:

x1=arguments[0];
y1=arguments[1];
x2=arguments[2];
y2=arguments[3];

return Math.sqrt(Math.pow(x1-x2,2)+Math.pow(y1-y2,2))

and than a comparator that compares this value tot the combined radiusses.

Kind regards
Groeten
Gertjan

[Woland]

This looks very promising, thanks so much!

What exactly do the variables x1, y1, x2, y2 stand for though? Which are the distances and which are the radii?

[GertjanB]

X1&Y1 are the center coordinates of object 1
X2 & Y2 are the center coordinates of object 2

The output of the javascript "Math.sqrt(Math.pow(x1-x2,2)+Math.pow(y1-y2,2))" is the distance between these two points.

the radius is not in this formala. 

for example if you have 2 objects with a radius of 2. than if the distance is 4 you know they collide.

if you work with squares you can do the same but you have to do the X and Y distance separately.

[DusX]

I've done a bunch of this.. I will pull up some example files and post them here for you.
I've been working with both, Square/rectangular detection, and circular detection.
DEMO FILE (created in Isadora 3.0.7)

These are 2 demo scenes from my Generating Content workshop taught at the 2019 Isadora Werkstatt in Berlin.

NOTE: In these files, I am not looking at the 'size' of the colliding particle, only the size of the target. (think bullet and target). Its not hard to add to if needed though.

[DusX]

If you need something much more true to the laws of physics, you can look at this demo:

The DEMO FILE is zipped with the required Javascript files (all reside in the same folder).
I have included a number of resource URLs in the JS code, that will be helpful in figuring out how this works.