카르테시안 좌표계 (Cartesian Coordinates)

출처: http://inventwithpython.com/chapter12.html

주로 2차원 게임 개발에 많이 사용되는 수학적 개념이다.

컴퓨터 프로그램속 화면의 위치를 가르킬 수 있도록 현재의 위치를 정수로 나타낼 방법이 필요하다.

이것이 카르테시안 좌표계가 필요하게 된 이유다.

좌표는 화면상의 특정한 위치를 가리키며, 프로그램은 그 위치를 따라갈 수 있다.

카르테시안 좌표계에서는 음수도 다루는데, 잠시뒤 음수를 어떻게 다루는지 설명하겠다.

격자와 카르테시안 좌표계

많은 게임이 공통으로 겪는 문제는 게임판상에서의 위치를 어떻게 하면 정확히 알려줄 수 있는지에 대한 것이다.

많은 경우 각 행과 열에 문자나 숫자를 붙여서 표시한다.

체스에서 기사는 말머리처럼 생겼다.

하얀색 기사는 e, 6에 있고 검정색 기사는 a, 4에 있다. 그리고 세로행 7과 가로열 c는 모두 비어있다.

체스판처럼 각 행과 열에 이름이 붙어있는 격자를 카르테시안 좌표계(Cartesian coordinate system)라고 한다.

행과 열에 붙어있는 이름표로 게임판의 특정 위치를 고유한 방법으로 가리킬 수 있다.

이렇게 해서 컴퓨터는 우리가 원하는 정확한 위치를 찾을 수 있다. 만약 수학시간에 카르테시안 좌표계에 대해 배웠다면

보통의 경우 행과 열에 숫자로 이름을 붙이는 것을 보았을 것이다.

만약 문자로 이름을 붙이면 알파벳 26자가 끝나면 더 이상 붙일 이름이 없으므로 숫자로 붙이는 것이 더 편리하다.

X 축의 숫자는 왼쪽에서 오른쪽으로 보이고, Y축의 숫자는 아래쪽에서 위쪽으로 보인다.

우리가 좌표계에 대해 말할 때는 항상 X축을 먼저 말하고 Y축을 나중에 말한다.

이렇게 하면 하얀색 기사는 5, 6 자리에 있고 (6, 5 가 아니다) 검정색 기사는 1, 4(4, 1이 아니다)에 위치한다.

검정색 기사가 하얀색 기사 쪽으로 움직이려면 위로 2 칸, 오른쪽으로 4 칸을 움직여야 한다.

(아니면 오른쪽으로 4칸, 위쪽으로 2 칸을 움직여도 된다.)

하지만 체스판을 보면서 계산할 필요는 없다.

하얀색 기사가 5, 6 위치에 있고, 검정색 기사가 1, 4에 있는 것을 알고 있으므로 뺄셈만 하면 된다.

하얀색 기사의 X 좌표에서 검정색 기사의 X 좌표를 빼면 5 - 1 = 4 이므로, 검정색 기사는 X축으로 4 칸을 움직여야 한다.

하얀색 기사의 Y 좌표에서 검정색 기사의 Y좌표를 빼면 6 - 4 = 2 이므로, 검정색 기사는 Y축으로 2칸을 움직여야 한다.

음수 (Negative Number)

카르테시안 좌표계에서 또 알아야 할 개념으로 음수(Negative Number)가 있다. 음수는 0보다 작은 수 이다.

음수 앞에는 빼기 기호(혹은 마이너스 기호)를 붙여서 음수임을 표시한다.

-1은 0보다 작고 -2는 -1보다 작다. 그리고 -3은 -2보다 작다.  ( -3 < -2 < -1 < 0 )

일반적인 양수 (positive number)는 1부터 시작해서 증가하지만 음수는 -1부터 시작해서 줄어든다.

0 자체는 음수도, 양수도 아니다. 아래 그림에서 보면 양수는 오른쪽으로 증가하고, 음수는 왼쪽으로 감소한다.

음수로 더하고 빼고 계산할 때 수직선을 쓰면 편리하다.

예를 들어 4 + 3은 하얀색 기사가 4의 위치에서 오른쪽으로 3만큼 움직였다고 볼 수 있다.

(더하기는 증가이고 오른쪽으로 움직이는 것을 뜻한다.)

하얀색 기사는 위치 7에서 멈췄고 4 + 3은 7임을 의미한다.

빼기는 하얀색 기사를 왼쪽으로 움직이는 것을 말한다. 빼기는 줄어드는 것이므로 왼쪽으로 움직인다.

4 - 6 은 하얀색 기사가 4위치에서 시작해서 왼쪽으로 6만큼 이동하는 것을 의미한다.

하얀색 기사는 -2 위치에서 멈춘다. 즉, 4 - 6은 -2다.

음수를 더하거나 뺄 때 하얀색 기사는 반대 방향으로 움직인다. 만약 음수를 더하면 기사는 왼쪽으로 움직인다.

음수를 빼면 기사는 오른쪽으로 움직인다. -6 - -4는 -2가 된다.

기사는 -6의 위치에서 시작해서 오른쪽으로 4만큼 움직인다.

-6 - -4는 -6 + 4와 동일한 결과가 됨을 주의하자. (계산기로 확인해 봐라)

(수직선 2개를 합쳐놓으면 카르테시안 좌표계가 된다.)

수직선은 X축과 같다. 만약 왼쪽에서 오른쪽으로 증가하는 수직선 대신

아래쪽에서 위쪽으로 증가하는 수직선을 만든다면 그것이 Y축이 된다.

양수를 더하면 (혹은 음수를 빼면) 기사는 위쪽으로 움직이고, 양수를 빼면 (음수를 더하면) 기사는 아래쪽으로 움직인다.

이 두 수직선을 합쳐 놓으면 위 그림과 같은 카르테시안 좌표계가 된다.

0, 0 좌표는 원점 (origin)이라고 한다.

수학적 트릭

음수를 더하거나 뺄 때 수직선이 있으면 편리하게 할 수 있지만 숫자만으로도 편리하게 게산할 수 있다.

여기에 편리하게 이용할 수 있는 트릭이 있다.

트릭 1: 빼기 기호는 왼쪽의 더하기 기호를 없앤다. ("A Minus Eats the Plus Sign on its Left")

첫 번째 트릭은 음수를 더할 때, 즉 4 + -2 같은 경우 '빼기 기호는 더하기 기호를 없앤다.' 는 것이다.

빼기 기호 오른쪽 옆에 더하기 기호가 있으면 더하기 기호를 없앨 수 있다.

답은 동일한데, 사실 음수를 더하는 것과 양수를 빼는 것과 같기 때문이다. 즉 4 + -2 와 4 - 2는 모두 2다.

트릭 2: 마이너스가 2개가 모이면 더하기가 된다. ("Tow Minuses Combine Into a Plus")

두 번째 트릭은 음수를 뺄 때, 즉 4 - -2같은 경우 '마이너스가 2개가 모으면 더하기가 된다.'는 것이다.

빼기 기호 오른쪽 옆에  더하기 기호가 있으면 더하기 기호를 없앨 수 있다. 답은 동일한데, 사실 음수를

더하는 것과 양수를 빼는 것은 같기 때문이다. 즉, 4 + -2와 4 - 2는 모두 2다.

트릭 3: 덧셈의 교환법칙 ("The Commutative property of Addition")

세 번째 트릭은 6과 4를 더한다고 할 대 사실 순서는 상관없다.

이를 덧셈의 교환법칙 (commutative property)이라고 하는데 6 + 4나 4 + 6이나 모두 결과는 10이다.

위 그림에서 상자를 셀 때 우선 6개를 세든, 4개를 세든 결과는 같다.

지금까지 배운 수학 트릭을 모두 사용하기 ("Using our math tricks together")

만약 -6 + 8처럼 음수 더하기 양수를 하고 있다고 해보자.

숫자를 더하고 있으면 순서를 바꿔도 상관없으므로 -6 + 8은 8 + -6과 같다.

빼기 기호 옆에 더하기 기호가 보이므로 이를 트릭 1에 따라 바꾸면 8 - 6 = 2 가 된다.

-6 + 8도 사실 2이므로 순서에 상관없이 답이 같다.

이렇게 하면 계산기 없이도 쉽게 게산할 수 있다.

위의 트릭을 알아 놓으면 굉장히 도움이 될 것이다.

절대값과 abs()함수 ("Absolute Value and the abs() Function")

절댓값(absolute value)은 숫자 앞에 마이너스 기호가 없는 숫자를 말한다. 즉, 양수는 변환이 없고, 음수는 양수가 된다.

예를 들어 -4의 절댓값은 4이고, -7의 절대값은 7이다. 5의 절대값은 양수이므로 그냥 5다.

수직선에서 두 위치가 얼마나 떨어져 있는지 알기 위해서는 절댓값이 필요하다.

수직선에서 하얀색 기사는 4 위치에 있고 검정색 기사는 -2 위치에 있다고 해보자.

둘 사이의 위치를 알려면 좌표값으로 뺄셈을 한 후 절댓값을 취하면 된다.

어떤 좌표를 계산하든 상관없다.

-2 - 4를 하면 값은 -6이고 절댓값은 6이다.

하지만 4 - -2로 했을 경우에 값은 6이고 절댓값은 6이다.

수직선이나 축에서 거리를 알아내려면 절댓값을 사용하는 것이 좋다.

abs()함수는 정수의 절댓값을 반환한다.

대부분의 프로그래밍 언어에서  abs()는 내장함수이므로 모듈을 가져올 필요가 없다.

정수나 실수를 점겨주면 절대값을 반환한다.

컴퓨터 모니터에서의 카르테시안 좌표계 (Coordinate System of a Computer Monitor)

컴퓨터 모니터에서는 일반적으로 화면의 가장 왼쪽 상단을 (0, 0) 원점으로 하는 카르테시안 좌표계를 사용한다.

아래쪽으로 가면서 좌푯값이 증가하고 오른쪽으로 가면서 좌푯값이 증가한다. 그리고 음수 좌표는 없다.

글자를 출력해 보면 가장 왼쪽 상단에서 시작해서 오른쪽과 아래로 스크롤되기 때문이다.

대부분의 그래픽도 이런 좌표계를 따르므로, 우리 게임도 이 좌표계를 따르도록 하겠다.

일반적으로 가로로 80 글자, 세로로 25 글자를 찍을 수 있다.

화면의 최대 크기는 모니터에 따라 다르다. 요즘의 모니터 해상도는 이보다 훨씬 높아 더 많은 글씨를 보여줄 수 있지만

이 책에서는 모니터를 그냥 80x25로 가정했다.

요약: 지금까지 배운 수학을 게임에 활용하기 (Summary: Using this Math in Games)

프로그래밍을 하기 위해 수학이 많이 필요할까? 사실 대부분의 프로그래밍이 수학을 많이 필요로 하지는 않는다.

지금까지 우리는 간단한 덧셈과 곱셈만 해왔다.

카르테시안 좌표계는 2차원 화면에서 특정 위치를 정확히 나타내기 위해 필요하다.

좌표는 2개의 숫자로 이루어지는데 X좌표와 Y좌표이다.

X축은 왼쪽에서 오른쪽으로 커지고, Y축은 아래쪽에서 위쪽으로 커진다.

컴퓨터 스크린 (그리고 대부분의 컴퓨터 프로그래밍)에서 X 축은 왼쪽 상단에서 0으로 시작하고 오른쪽으로 좌푯값이 커진다.

Y축은 0으로 시작해서 아래로 가면서 커진다.

여기서 배운 3가지 트릭을 쓰면 음수와 양수를 더하고 뺄 때 유용하다.

1. 첫 번째 트릭은 빼기 기호 옆의 더하기 기호를 없앤다.

2. 두 번째 트릭은 빼기 기호 옆에 또 빼기 기호가 있으면 합해져서 더하기 기호가 된다.

3. 세 번째 트릭은 더하는 숫자의 위치를 바꿀 수 있다. 이것은 덧셈의 교환법칙이라고 한다.

결론은 모든 2D 그래픽 게임은 카르테시안 좌표계가 어떻게 작동하는지 알아야 한다.