Jak obliczyć odległość między punktem a prostokątem wyrównanym do osi?

Mam prostokąt 2D z pozycją x, y, wysokością i szerokością oraz w pobliżu losowo ustawionego punktu.

Czy istnieje sposób, aby sprawdzić, czy ten punkt może kolidować z prostokątem, jeśli znajduje się bliżej niż pewna odległość? Wyobraź sobie, że niewidoczny promień poza tym punktem koliduje ze wspomnianym prostokątem. Mam z tym problemy po prostu dlatego, że to nie jest kwadrat!

Jeśli (x,y)jest środkiem prostokąta, kwadratową odległość od punktu (px,py)do granicy prostokąta można obliczyć w następujący sposób:

dx = max(abs(px - x) - width / 2, 0);
dy = max(abs(py - y) - height / 2, 0);
return dx * dx + dy * dy;

Jeśli ta kwadratowa odległość wynosi zero, oznacza to, że punkt dotyka lub znajduje się w prostokącie.

Zakładam, że twój prostokąt jest wyrównany względem osi.

Musisz tylko „zaciśnąć” punkt w prostokącie, a następnie obliczyć odległość od zaciśniętego punktu.

Punkt = (px, py), Prostokąt = (rx, ry, szerokość, wysokość) // (lewy górny róg, wymiary)

function pointRectDist (px, py, rx, ry, rwidth, rheight)
{
    var cx = Math.max(Math.min(px, rx+rwidth ), rx);
    var cy = Math.max(Math.min(py, ry+rheight), ry);
    return Math.sqrt( (px-cx)*(px-cx) + (py-cy)*(py-cy) );
}

W tym celu należy użyć kolizji koło-prostokąt. Jest podobny pytanie na przepełnienie stosu.

Środek twojego okręgu byłby pytaniem, a promień byłby odległością, którą chcesz sprawdzić.

Jeśli próbujesz obliczyć odległość od punktu do krawędzi prostokąta, praca z każdym z dziewięciu regionów utworzonych przez prostokąt może być najszybszym sposobem:

function pointRectangleDistance(x, y, x1, y1, x2, y2) {
    var dx, dy;
    if (x < x1) {
        dx = x1 - x;
        if (y < y1) {
            dy = y1 - y;
            return Math.sqrt(dx * dx + dy * dy);
        }
        else if (y > y2) {
            dy = y - y2;
            return Math.sqrt(dx * dx + dy * dy);
        }
        else {
            return dx;
        }
    }
    else if (x > x2) {
        dx = x - x2;
        if (y < y1) {
            dy = y1 - y;
            return Math.sqrt(dx * dx + dy * dy);
        }
        else if (y > y2) {
            dy = y - y2;
            return Math.sqrt(dx * dx + dy * dy);
        }
        else {
            return dx;
        }
    }
    else {
        if (y < y1) {
            return y1 - y;
        }
        else if (y > y2) {
            return y - y2;
        }
        else {
            return 0.0; // inside the rectangle or on the edge
        }
    }
}

[Zmodyfikowana odpowiedź na podstawie komentarzy]

Jeśli chcesz sprawdzić, czy punkt znajduje się w granicach powiedzmy 10 jednostek, jeśli szary prostokąt na obrazku poniżej, sprawdzisz, czy punkt znajduje się w jednym z

1. czerwony prostokąt
2. Niebieski prostokąt
3. dowolny z zielonych kół (promień 10)

inside=false;

bluerect.x=oldrect.x-10;
bluerect.y=oldrect.y;
bluerect.width=oldrect.width;
bluerect.height=oldrect.height+20;

if(  point.x >=bluerect && point.x <=redrect.x+bluerect.width &&
     point.y >=bluerect && point.y <=redrect.y+bluerect.height){
         //now point is side the blue rectangle
         inside=true;
}

redrect.x=oldrect.x;
redrect.y=oldrect.y-10;
redrect.width=oldrect.width+20;
redrect.height=oldrect.height;

if(  point.x >=redrect&& point.x <=redrect.x+redrect.width &&
     point.y >=redrect&& point.y <=redrect.y+redrect.height){
         //now point is side the redrectangle
         inside=true;
}


d1= distance(point, new point(oldrect.x, oldrect.y)) //calculate distance between point and (oldrect.x, oldrect.y)
d2= distance(point, new point(oldrect.x+10, oldrect.y))
d3= distance(point, new point(oldrect.x, oldrect.y+10))
d4= distance(point, new point(oldrect.x+10, oldrect.y+10))
if (d1 < 10 || d2 <10 || d3 < 10 || d4 <10){
    inside=true;
}

//inside is now true if the point is within 10 units of rectangle

To podejście jest trochę nieeleganckie. Podobna metoda, która pozwala uniknąć konieczności testowania wszystkich 4 rogów za pomocą symetrii prostokąta, jest tutaj udokumentowana podczas przepływu stosu

Możesz użyć czegoś takiego: