Loading...

2D AABB Collision Detection in JavaScript | Rectangle AABB Test | Axis-Aligned Bounding Box

5,392 views

Loading...

Loading...

Transcript

The interactive transcript could not be loaded.

Loading...

Loading...

Rating is available when the video has been rented.
This feature is not available right now. Please try again later.
Published on Jun 14, 2016

So this is the proverbial AABB collision detection test in JavaScript. Rectangles and squares can be tested against each other using this test. We just need to find out if two rects being tested for overlap in this collision detection tutorial that demonstrates 2D AABB (axis-aligned bounding box) test... and the basic math behind it. AABB x AABB tree is not part of this tutorial, but it's something I'm planning in the near future..

In a real world-scenario, AABB bounding box is usually first calculated from a more complex polygon. But this will be covered later in the tutorial series, when we get to physics engine development. Let's AABB pick up the pieces one by one in this tutorial.

Collision between two rectangles involves writing some of the simplest algorithms you can possibly come across, and shouldn't take more than 5 minutes of your time to construct.

Loading...

Advertisement
When autoplay is enabled, a suggested video will automatically play next.

Up next


to add this to Watch Later

Add to

Loading playlists...