Search code examples
mathgeometrytrigonometryprocessing.js

Knowing two points of a rectangle, how can I figure out the other two?


Hey there guys, I'm learning processing.js, and I've come across a mathematical problem, which I can't seem to solve with my limited geometry and trigonometry knowledge or by help of Wikipedia.

I need to draw a rectangle. To draw this rectangle, I need to know the coordinate points of each corner. All I know is x and y for the midpoints of the top and bottom of the box, and the length of all four sides.

There is no guarantee on the orientation of the box.

Any help? This seems like it should be easy, but it is really stumping me.


Solution

  • If this quadrilateral is a rectangle (all four angles are 90 degrees), then it can be solved. (if it could be any quadrilateral, then it is not solvable)

    if the points are (x1,y1), and (x2, y2), and if the two points are not perfectly vertical (x1 = x2) or horizontal (y1 = y2), then the slope of one edge of the rectangle is

    m1 = (y2-y1) / (x2-x1) 
    

    and the slope of the other edge is:

    m2 = - 1 / m1
    

    If you know the lengths of the sides, and the midpoints of two opposite sides, then the corrner points are easily determined by adding dx, dy to the midpoints: (if L is length of the sides that the midpoints are on)

    dx = Sqrt( L^2 / (1 + m2^2) ) / 2
    

    and

    dy = m2 * dx
    

    NOTE: if the points are vertically or horizontally aligned, this technique will not work, although the obvious solution for those degenerative cases is much simpler.