Question

I know how to check if a circle is about to collide with a square, and I know how to detect if a square is about to collide with a square, but how would I go about detecting if a polygon is about to collide with a square?

Or better yet, when a polygon is about to collide with a polygon.

OR better yet, when a shape made up of lines that are not straight collides with another similar shape, a polygon, or a circle/rectangle

Is there any way to get the pixels a shape would take up maybe and the pixels another shape would take up and check if any of them are the same?

I am hoping there is some solution that doesn’t require a ton of shape specific calculation.

I am using javascript and html5 canvas to do this.

Answer 1

This is not a simple stuff. If you are satisfied that a function can tell if two polygons are colliding (and you can roll back them), then the solution is not so hard. You just need to check if any two of the polygon’s sides are crossing each other or not. This can be done by some math, and with big shapes or lot polygons it can eat away the performance. To solve this, you may use space partitioning and bounding volumes.

UPDATE:
You can calculate the intersection of lines based on this. Then you need to check if this point is in both segment or not. To do this, you can use the endpoints of the segments, and the ua and ub variables will be between 0-1 if the segment actually contains the point.