2D에서 회전 행렬 처리 및 기저 벡터 처리로 카메라 뷰 구현

회전 행렬 및 기저 벡터의 차원 적용

이 게시글에서는 벡터 처리를 통해서 회전하는 방법, 기저 벡터를 적용함으로써 어떻게 회전 행렬을 만드는지, 기본 카메라 룩 엣의 원리에 대해서 2D로 구현해보기로 한다.

아래 프로그램은 완성본 프로그램이다. 왼쪽이 실제 월드의 공간이고, 오른쪽이 현재 카메라 영역을 기준으로 하여 원 위치로 가져오는 역할을 수행한다. 즉 우측은 카메라가 쳐다보는 카메라 공간을 나타내는 것이라고 볼 수 있다. 말이 그렇지, 사실은 forward vector 와 right vector 회전 정도만큼 월드 공간에서 당겨온 것이라고 볼 수 있다. 카메라가 회전된 만큼 월드 공간을 역회전 시킨다고 보면된다.

이렇게 원점으로 가져오는 이유는, 새로운 카메라 공간에서 연산을 하기 위함이다. 지금은 단순히 2D 공간에서 이렇게 배치를 하였지만, 3D 공간에서는 카메라가 실제 쳐다보는 Lookat 영역 forward, right, up 벡터 매트릭스 (기저벡터 메트릭스)의 역행렬을 통해서 카메라 공간으로 이동할 때 사용된다고 볼 수 있다.

코드는 매우 매우 간단하다. 우선 기본적인 매트릭스 처리와 벡터 처리를 담당하는 클래스는 필요하다. 2D 이기 때문에 법선 벡터를 구하기 위해 y, -x 등의 처리를 해주면 쉽게 법선 벡터를 구할 수 있다. 다만 3D 공간에서는 임의로 월드 공간 up을 구해, 카메라의 포워드와 외적을 하여 right를 구하고 foward와 right를 외적하여 카메라 up을 구하는 식으로 법선 벡터를 구해야 한다.

forward 벡터는 마우스가 향하는 벡터로 지정하였고, right는 이 forward 벡터의 법선 벡터로 하였다. 눈으로 봤을 때 우측으로 나오는 법선 벡터 결과 y, -x를 설정하였다. 만약 forward가 y 축 (0, 1)을 의미한다면, right는 (1, 0)이 된다. 즉 우리가 기본적으로 알고 있는 수학 좌표계의 x 축, y 축의 기저 벡터가 되는 것을 확인할 수 있다. forward는 y 축을 의미하는 기저벡터, right는 x 축을 의미하는 기저벡터이다.

선형 변환 이론에 따르면, 어떤 벡터가 회전되면 기저 벡터도 똑같이 회전된다는 사실을 알 수 있다. 회전된 벡터는 새로 회전된 기전 벡터의 조합으로 나타낼 수 있다.

즉, 원래 공간 x 축 (1,0) y 축 (0,1) 의 조합으로 하나의 벡터를 의미하던 공간에서, x 축 y 축이 회전된 만큼 어떤 행렬 처리를 해주면 그 회전된 기저 벡터 공간을 나타내는 회전된 벡터를 구할 수 있게 된다.

기본적인 기저 벡터의 행렬 구조는 다음과 같다.

[\begin{matrix} right_x & up_x \\ right_y & up_y \end{matrix}]

여기서 회전되지 않은 기본 월드 공간은 다음과 같다.

[\begin{matrix} 1 & 0 \\ 0 & 1 \end{matrix}]

즉 X 축을 향하는 기저 벡터, Y 축을 향하는 기저 벡터를 열 단위로 차례로 넣으면 된다. 이 행렬에 우리가 어떤 벡터를 곱해보자.

[\begin{matrix} 1 & 0 \\ 0 & 1 \end{matrix}] [\begin{matrix} 1 \\ 1 \end{matrix}] = [\begin{matrix} 1 \\ 1 \end{matrix}]

(벡터 표현식이 잘못된 건 양해바란다..) <1, 1>을 향하는 어떤 벡터를 위 행렬에 곱하면 그대로 <1,1>이 나온다. 당연히 회전되지 않은 기본 기저 벡터 공간이기 때문에 똑같은 값이 나와야 한다.

한편 회전된 기저 벡터를 넣어본다. 예를 들어, 90도 회전되면, y축이 x축이 되고, 기존 x축은 -y 가 된다. 즉 기존의 y 기저 벡터는 (1, 0)을 가르키게 되고, 기존의 x 기저 벡터는 (0, -1)을 가르키게 된다. 이를 행렬에 그대로 넣어본다.

[\begin{matrix} 1 & 0 \\ 0 & -1 \end{matrix}]

이 행렬에 아까 <1, 1> 벡터를 곱해본다.

[\begin{matrix} 1 & 0 \\ 0 & -1 \end{matrix}] [\begin{matrix} 1 \\ 1 \end{matrix}] = [\begin{matrix} 1 \\ -1 \end{matrix}]

결과 벡터도 90도 회전된 <1, -1>을 가르키는 것을 볼 수 있다.

즉 어떤 회전된 기저 벡터 차원(여기서는 2차원이므로 x, y 기저) 구하기만 하면 (직교 하는 기저 벡터) 회전된 점을 쉽게 구할 수 있다.

그러면 다시 앞으로 돌아가서, 카메라 뷰를 보여주기 위해서는 결과적으로 컴퓨터 화면에 표시를 해야한다. 특정 좌표를 컴퓨터 화면 뷰에 맞춰서 표시하려고 생각하면 어렵기만 하다. 역으로 생각하면 된다. 특정 좌표 공간을 컴퓨터 화면 앞으로 가져온다고 생각하자. 즉 카메라가 어떤 공간에 있든, 그 공간을 새로운 정규화된 공간인 -1 ~ 1 로 가져와서 디스플레이에 그대로 표시해주면 연산이 쉬워진다.

그러기 위해서는 카메라가 향하는 벡터만큼 역으로 다시 월드를 회전해야한다. 즉 카메라가 우측으로 30도 회전했으면 월드 공간을 결과적으로 -30도 회전하여 그대로 원점을 기준으로 가져오면 카메라가 쳐다보는 위치를 가져올 수 있다. 물론 3D 공간에서는 축의 방향에 따라 forward 벡터를 반대로 하는 등 여러 처리가 필요하지만 여기서는 단순히 임의 forward 벡터를 y축으로 하게끔 역 회전하면 되므로 계산이 복잡하지는 않다.

게다가, 이 기저 벡터들은 직교하기 때문에 역행렬을 구하기 위해 단순히 전치해주면 된다. 이는 직교하는 기저 벡터들이 담긴 행렬의 특성이다.

따라서 단순히 전치 행렬만 구하면 해당 방향의 역으로 회전하는 행렬을 구할 수 있다. 이를 이제 월드 공간에 곱하면 카메라가 바라보는 시점을 원점으로 가져올 수 있게 되는 것이다.