앞서, 포스팅에서 특정 좌표가 원 안에 있을 때 감지하는 글을 작성했는데 원이 아닌 타원형으로 감지하고 싶을 때가 있다. 원은 원인데 횡스크롤이나 2.5D기반 게임이라서 감지할 X축의 크기를 넓히고 싶다던지 등 게임 내에서도 여러모로 유용하게 사용할 수 있다. 구현 방법은 이전 포스팅과 비슷하다. function isPointInEclipse(pointX: number, pointY: number, circleX: number, circleY: number, rx: number, ry: number) { return (pointX - circleX) ** 2 / rx ** 2 + (pointY - circleY) ** 2 / ry ** 2
캐릭터의 기술중 삼각형 범위 안에 있는 적을 기절시키려 하는데 어떻게 구현할 수 있을까? 이는 부호 계산으로 감지할 수 있다. function isPointInTriangle( pointX: number, pointY: number, x1: number, y1: number, x2: number, y2: number, x3: number, y3: number ) { const a = (x1 - pointX) * (y2 - y1) - (x2 - x1) * (y1 - pointY); const b = (x2 - pointX) * (y3 - y2) - (x3 - x2) * (y2 - pointY); const c = (x3 - pointX) * (y1 - y3) - (x1 - x3) * (y3 - pointY..
FPS 게임에서 총으로 사격했을 때 총알의 궤적 안에 있는 적에게 대미지를 입히고자 한다. 어떻게 구현할 수 있을까? 이는 직선의 방정식을 이용하여 구현할 수 있다. /// 두 함수 모두 동일한 동작을 한다. // 직선의 방정식. // 방정식은 ax + by + c = 0이며, 점의 좌표를 대입하여 계산된 값은 직선과 점 사이의 관계를 나타낸다. function isPointInLine(pointX: number, pointY: number, x1: number, y1: number, x2:number , y2: number) { const a = y2 - y1; const b = x1 - x2; const c = x2 * y1 - x1 * y2; return a * pointX + b * pointY ..
격투 게임에서 원형 임팩트를 가진 스킬 사용시 원안에 있는 적에게 대미지를 주려고 한다면 어떻게 구현할 수 있을까? 간단하게 피타고라스 정리를 이용하여 구현할 수 있다. function isPointInCircle(pointX: number, pointY: number, circleX: number, circleY: number, radius: number) { return (pointX - circleX) ** 2 + (pointY - circleY) ** 2 이 함수는 주어진 좌표 평면에서 점이 원 내에 있는지 확인하는 함수이다. 피타고라스의 정리에 의하면 빗선의 길이는 수식 x^2 + y^2 = r^2 중에서 r^2이며, 빗선은 원의 반지름과 같다.즉, 특정 좌표(x^2 + y^2)가 원의 반..
UI 버튼을 화면에 표기하려 한다. 이 때 UI는 처음 화면 밖에 있다가 화면 중앙으로 빠르게 이동하면서 천천히 중앙에 도달하는 애니메이션 UI를 만들고 싶을 때 어떻게 하면 좋을까? function lerp(pos: number, tPos: number, amount: number) { return pos + (tPos - pos) * amount; } 바로 선형보간법을 이용하여 구현할 수 있다. 선형보간법이란? 시작점과 끝점, 두 점의 값이 주어졌을 때 그 사이에 위치한 값을 추정하기 위하여 직선 거리에 따라 선형적으로 계산하는 방법이다. UI 버튼의 X, Y 좌표를 선형보간법을 사용하여 매 프레임마다 일정 거리만큼 이동시켜주면 된다. const x = lerp(x, screenCenterX, 0.2..
내 캐릭터 기준 30도, 50m에 있는 적을 감지하고 싶을 때는 어떻게 구현할 수 있을까? 바로 삼각함수중 코사인 함수와 사인 함수를 이용하면 쉽게 구할 수 있다. 코사인(cos) 코사인은 삼각형에서 밑변의 길이를 빗변의 길이로 나눈 비율로 정의되며 각도 θ의 코사인을 나타내는 수식은 다음과 같다. cos(θ) = adjacent(각도 θ의 인접변의 길이) / hypotenuse(θ를 대변하는 삼각형의 빗변의 길이) 사인(sin) 각도의 사인은 삼각형에서 대변의 길이를 빗변의 길이로 나눈 비율로 정의되며 각도 θ의 사인을 나타내는 수식은 다음과 같다. sin(θ) = opposite(θ의 대변의 길이) / hypotenuse(θ를 대변하는 삼각형의 빗변의 길이) function lengthDirX(len..
라디안(radian)과 디그리(degree)는 각도를 측정하는 단위이다. 디그리(degree)는 원을 360도로 나누어 정의한 각도의 단위이며 수학에서는 호도법을 사용하여 2π 라디안이 360도에 해당하는 것으로 정의한다. 우리가 흔히 사용하는 육십분법은 디그리를 분과 초로 세분화하는 방법중 하나이다. 라디안(radian)은 반지름의 길이와 호의 길이의 비율로 정의되는 각도의 단위이며 라디안은 각도를 부채꼴의 호의 길이와 반지름의 길이를 기반으로 계산한다. 1라디안은 반지름의 길이와 호의 길이가 같을 때의 각도를 의미한다. 즉, 반지름의 길이만큼의 호의 길이를 가진 부채꼴의 중심각이 1라디안이 된다. 이런 특징으로 인해 삼각함수와 관련된 수학적인 연산이나 분석을 수월하게 하기 위해 라디안 단위를 사용한다..
게임을 개발하다보면 두 점의 각도를 구해야 할 때가 있다. 시야 시스템을 만든다고 가정하자. 내 캐릭터는 정면을 기준으로 특정 각도에 있는 적 캐릭터만 인지할 수 있으며 이외의 각도에서는 적 캐릭터를 볼 수 없는 시스템을 구현할 때 두 점(내 캐릭터 위치, 적 캐릭터 위치)의 각도를 계산할 필요가 있다. 그렇다면 두 점의 각도는 어떻게 구할 수 있을까? function direction(x1: number, y1: number, x2: number, y2: number) { return (180 / Math.PI) * (Math.atan2(x1 - x2, y1 - y2); } 두 점의 각도는 삼각함수 중 하나인 탄젠트의 역수, 아크탄젠트를 통해 구할 수 있다. 삼각함수란? 삼각함수는 주로 삼각비를 계산하..
수학은 게임에서 정말 많이 사용된다. 2D 게임이든, 3D게임이든 어떤 가상 공간을 표현하려면 좌표계가 있어야 하고 이 좌표계에 따라 위치와 방향을 표현할 수 있다. 두 점 사이의 거리를 계산할 때는 어떻게 해야 할까? // 1차원 좌표계 function distance(x1: number, x2: number) { return Math.abs(x1 - x2); } 1차원 좌표계에서는 꽤 간단하다. 내 위치에서 상대 위치를 뺀 값을 절대값으로 반환하면 나와 상대방의 거리를 계산할 수 있다. 절대값이란? 수의 크기를 나타내는 개념으로 수의 차이를 계산하거나, 거리를 계산하거나, 함수의 정의를 양수로 제한하는 등 다양하게 많이 사용되는 개념이다. 예시를 들면, X가 0인 수평 좌표계에서 5의 위치는 X로부터..
