두 개의 사각형이 HTML5 캔버스에서 맞았는지 확인합니다.

Question

저는 HTML5로 첫 게임을 만들고 있습니다. 두 개의 사각형이 서로 맞았는지 확인하는 방법을 알아야합니다. 지금까지, 나는 정말로 잘 모릅니다. 내가 시도한 코드는 다음과 같습니다. 그러나 적이이 점을 칠 때만 작동합니다. 여기 지금까지입니다 : 나는이 권리를 수행하는 방법에 대한 혼란 스러워요

if(this.drawX >= enemies[i].drawX && this.drawX <= enemies[i].drawX + enemies[i].width && this.drawY >= enemies[i].drawY && this.drawY <= enemies[i].drawY + enemies[i].height) { 

. 누구든지 나를 도울 수 있을까?

편집 :

if (!(this.drawX + this.width < enemies[i].drawX || 
     enemies[i].drawX + enemies[i].width < this.drawX || 
     this.drawY + this.height < enemies[i].drawY || 
     enemies[i].drawY + enemies[i].height < this.drawY)) { 
        gameOver(); 
      } 

코드는 게임이 거의 무작위로 종료 있는지 확인하는 것 : 나는이 코드를 시도했다. 너무 오래 기다려서 죄송합니다. 어떻게 해결할 수 있습니까?

Answer 1

사각형이 교차하는 경우 한 사각형의 모서리가 다른 사각형 내부에 있어야합니다 (회전하지 않는다고 가정). 직사각형과 점을 취하고 점이 사각형 내부에 있으면 true를 반환하는 함수를 작성하십시오. 그런 다음 해당 함수를 8 번 (각 구석에 대해 한 번) 호출하고 결과를 ||과 결합하십시오.

Answer 2

는이 같은 함수를 작성해야

function (rectA, rectB) { 
    return !(rectA.x + rectA.width < rectB.x || 
      rectB.x + rectB.width < rectA.x || 
      rectA.y + rectA.height < rectB.y || 
      rectB.y + rectB.height < rectA.y); 
};