Home arrow Articles arrow Flash arrow Collision detection & bouncing part 1: intersection of line segments
Collision detection & bouncing part 1: intersection of line segments Print E-mail
Sunday, 23 April 2006
Article Index
Collision detection & bouncing part 1: intersection of line segments
Slope-Intercept form
Parametric form
Flash demo and sample code

Slope-Intercept form

I'll just give you a quick reminder on the Slope-Intercept equation of a line. There are many excellent resource on the internet that will give you a detailed explanation.
The slope-intercept form of a line: y = m*x + b
where m is the slope of the line and b is the point where the line intersects the Y-axis.
If we know 2 points of the line, we can calculate m and b:
point1 = (xp1, yp1), point2 = (xp2, yp2)
m = (yp2 - yp1) / (xp2 - xp1)
b = yp1 - m*xp1


Image

e.g. for a line with point1 = (2, 4) and point2 =  (10, 8)
m = (8 - 4) / (10 - 2) = 4 / 8 = 1 / 2
b = 4 - 1 / 2 * 2 = 4 - 1 = 3

So the Slope-Intercept form is y = 1/2*x + 3

There is one problem with this form. Vertical lines can't be described in this way. Suppose we have a line with point3 = (6, 1) and point4 = (6, 10):
m = (y2 - y1) / (x2 - x1) = 10 - 1 / 6 - 6 = 9 / 0
Division by 0 is invalid. So a vertical line is described as x = n, in this case x = 6.

A horizontal line can be put in Slope-Intercept form:
y = m*x + b = 0*x + b = b => y = b

The intersection of two lines is the point that is shared by these two lines.
line1: y1 = m1*x + b1
line2: y2= m2*x + b2
m1*x + b1 = m2*x + b2 =>
m1*x - m2*x = b2- b1 =>
x*(m1 - m2) = b2 - b1 =>
x = (b2 - b1) / (m1 - m2)

Now we have the x-coordinate of the intersection and we can solve the eqation for y.

Since we need the intersection of 2 line segments rather than lines, we need to check if the intersection point lies within the bounds of our line segments:
xi = x-coordinate of intersection point
yi = y-coordinate of intersection point
min(xseg1) = the lowest x-coordinate of segment 1
min(yseg1) = the lowest y-coordinate of segment 1
max(xseg1) = the highest x-coordinate of segment 1
max(yseg1) = the highest y-coordinate of segment 1
min(xseg2) = the lowest x-coordinate of segment 2
min(yseg2) = the lowest y-coordinate of segment 2
max(xseg2) = the highest x-coordinate of segment 2
max(yseg2) = the highest y-coordinate of segment 2

Two line segments intersect if:
min(xseg1) <= xi <= max(xseg1) and min(yseg1) <= yi <= max(yseg1) and min(xseg2) <= xi <= max(xseg2) and min(yseg2) <= yi <= max(yseg2)

Example

Image

Step 1: get the slope and intercept.

segment 1: point1 = (2, 4) and point2 =  (10, 8)
m1 = (8 - 4) / (10 - 2) = 4 / 8 = 1 / 2
b1 = 4 - 1 / 2 * 2 = 4 - 1 = 3

The slope-Intercept form of line 1 is y = 1/2*x + 3

segment 2: point3 = (3, 7) and point4 =  (12, 4)
m2 = (4 - 7) / (12 - 3) = -3 / 9 = -1 / 3
b2 = 7 + 1 / 3 * 3 = 7 + 1 = 8

The slope-Intercept form of line 2 is y = -1/3*x + 8

Step 2: get the intersection.

m1*x + b1 = m2*x + b2 =>
1/2*x + 3 = -1/3*x + 8 =>
1/2*x + 1/3*x = 8 - 3 =>
(1/2 + 1/3)*x = 8 - 3 =>
x = (8 - 3) / (1/2 + 1/3) =>
x =6

y = m1*x + b1 =>
y = 1/2 * 6 + 3 =>
y = 3 + 3 = 6

The lines intersect at point(xi, yi) = point(6, 6)

Step 3: check the segment boundaries

min(xseg1) = 2, min(yseg1) = 4
max(xseg1) = 10, max(yseg1) = 8
min(xseg2) = 3, min(yseg2) = 4
max(xseg2) = 12, max(yseg2) = 7

The line segments intersect if:
min(xseg1) <= xi <= max(xseg1) and min(yseg1) <= yi <= max(yseg1) and min(xseg2) <= xi <= max(xseg2) and min(yseg2) <= yi <= max(yseg2)
2 <= 6 <= 10 and 4 <= 6 <= 8 and 3 <= 6 <= 12 and 4 <= 6 <= 7

This is true, so the line segments intersect.



Comments
Great work on collision detection! I was searching the net for a solution to collision detection with lines and this is the best site so far! The only difficulty i have is understanding the math, particularly Cramer's rule. Other than that, everything else is quite simply explained. Keep it with the good work! :D
  Posted by israel, on Saturday, 10 March 2007 at 4:20

Thank you. it has been much more useful than anything else I found googling around.
M

  Posted by Marco, on Wednesday, 23 May 2007 at 4:54


 1 
Page 1 of 1 ( 2 comments )
©2005 MosCom

Add your comments to this article Collision detection & bouncing part... ...

Name (required)

E-Mail (required)
Your email will not be displayed on the site - only to our administrator
Homepage

Comment