오르카의 아틀리에


학교에서 들었던 컴퓨터 그래픽스 수업은 정말 지루했습니다... (지금까지 대학교생활에서 가장 재미없던 강의로 손에 꼽을 듯) 그래도 그중에서 재미있었던 파트를 꼽자면 <좌표계 변환>과 <커브>를 고를 수 있을 것 같습니다. 좌표계 변환은 이다음에 알아보기로 하고 지금은 <커브>에 관련해서 정리해보려 합니다.


수학적인 곡선

곡선은 수학적으로 어떻게 표현할 수 있을까요? 꺼무위키를 인용해 보면 다음과 같습니다.


...

좀 더 엄밀하게 말하자면 연속적인 순서쌍의 집합이나 선으로 동형사상이 있는 위상 공간 정도일 것이다.


조금 더 이해하기 쉽게 우리에게 친숙한 xy-평면인 $R^{2}$ 공간으로 생각한다면, 평면 위의 곡선은 어떠한 연속함수 $\varphi:\left[0,1\right]\to R^2$가 있어서 $S=\left\{\left(x,y\right)\in R^{2}\big|\left(x,y\right)\in\varphi\left(\left[0,1\right]\right)\right\}$의 형태로 나타내어지는 순서쌍의 집합으로 나타낼 수 있겠다.[1]

...

- 출처 : 나무위키


이렇게 된다면, 어떤 선을 그리고 그것을 연속함수로 표현할 수 있다면, 곡선을 그렸다고 말할 수 있을 것입니다.


곡선을 표현하기 위해서는 연속함수를 작성하면 된다는 것을 알았습니다. 그렇다면 어떻게 원하는 곡선을 표현할 수 있는 연속함수를 매번 찾을 수 있을까요? 사람들은 이런 문제를 해결하기 위해 여러 가지 방법론을 연구하고 만들어 왔습니다.


곡선의 표현

유한한 길이의 곡선을 만든다고 가정을 해보면, 두 점 사이를 어떻게 연속적으로 채워 넣을 것인지 고민해보면 됩니다. 여기서 연속적으로 채워 넣는 행위는 크게 보간(Interpolation)근사(Approximation)로 나뉘게됩니다. 보간의 특징은 주어진 점을 통과하는 곡선을 그리게 된다는 것이고, 근사는 양 끝점(시작점과 마지막점)을 제외한 점을 통과하지 않는다는 특징이 있습니다. 이번 포스팅을 통해 여러 가지 곡선의 표현방법을 공부해볼 것입니다.


바로 방법론에 들어가기 전에 몇가지 알아 두어야하는 요소들이 있습니다. 바로, 지역성(Locality)과 연속성(Continuity)입니다. 먼저 지역성을 살펴봅시다. 


지역성


곡선 표현에서 지역성이란, 제어점을 움직일 때 다른 구간에 미치는 영향력이라고 보면 됩니다. 우리는 제어점을 조절하여 원하는 곡선을 표현하게 됩니다. 편집할 때 다른 구간에 영향을 적게 주어야 편집하기 편하겠죠? 이 영향력이 적을수록 좋다고 말하고, 국부제어가 된다고 하며 지역성(Locality)가 높다고 말합니다. 일반적으로 차수가 높은 다항식을 이용하면 지역성이 떨어지기 때문에 3차 다항식을 사용하는 것이 일반적입니다.


연속성

수학에서의 연속성은 "부드러운 정도"를 나타낸다고 생각하면 편합니다. 곡선 표현에서도 마찬가지이며 부드러움의 종류에 따라 연속성을 분류하여 표현하고 있습니다. 이 분류에 따라서 곡선의 수학적인 특징들을 알 수 있게 됩니다. 대략적인 분류는 다음과 같습니다.


$C^0$ 연속 : 두 곡선이 단순히 연결, $G^0$ 연속과 닮음

$C^1$ 연속 : 접선벡터(Tangent Vector)의 방향과 크기가 일치

$C^2$ 연속 : 양쪽 곡선의 곡률이 동일, 1차 및 2차 도함수가 동일

$C^n$ 연속 이외에도 $G^n$연속도 있지만 일단 $C^n$ 연속까지만 설명하도록 하고 본격적으로 곡선을 다루어봅시다.


곡선을 배우기 시작하면 가장 먼저 배우는 곡선이 에르밋 곡선과 베지어 곡선일 것입니다. 두 곡선은 보간과 근사를 대표하는 가장 기본적인 곡선 표현 방법입니다.


에르밋 곡선

에르밋 곡선은 두 점과 두 개의 벡터를 통해 나타냅니다. 또한, 위에서 설명한 지역성 이슈와 $C^2$ 연속을 만족하기 위해서 3차 곡선을 통해 표현합니다.


$P(u) = a_0 + a_1 u + a_2 u^2 + a_3 u^3$


위 식은 $a_0, a_1, a_2, a_3$라는 벡터들을 조절해서 곡선을 그릴 수 있지만, 특정 변수를 조정한다고 해서 어떤 모양으로 변화할지 예측하기 힘듭니다. 즉 표현은 할 수 있지만, 우리가 직관적으로 다루기 어렵습니다.


또한, 에르밋 곡선은 두 개의 점과 두 개의 벡터를 통해 나타낸다고 했습니다. 그 때문에 다음과 같이 변형하여 사용하게 됩니다.


$\begin{array}{} P(0) &=& P_0 &=& a_0 \\ P(1) &=& P_1  &=& a_0 + a_1 + a_2 + a_3 \\P^\prime(0) &=& {P^\prime}_0 &=& a_1 \\P^\prime(1) &=& {P^\prime}_1 &=& a_1 + 2a_2 + 3a_3 \end{array}$


함수와 도함수에 0과 1을 넣어 계수들만 뽑아냈습니다. 위 식을 각 계수들에 대해서 풀어보면


$\begin{array}{} a_0&=&{P_0}\\ a_1&=&{P_1}\\a_2&=&-3{P_0}+3{P_1}-2{{P^\prime}_0}-{{P^\prime}_1}\\a_3&=&2{P_0}-2{P_1}+{{P^\prime}_0}-{{P^\prime}_1}\end{array}$


이 식을 이용해 식을 풀어쓰고 Matrix form으로 만들면 다음과 같습니다.


$\begin{array}{} P(u) &=& a_0 + a_1 u + a_2 u^2 + a_3 u^3 \\ &=& {P_0} + {P_1}u + (-3{P_0}+3{P_1}-2{{P^\prime}_0}-{{P^\prime}_1}){u^2} + (2{P_0}-2{P_1}+{{P^\prime}_0}-{{P^\prime}_1}){u^3}\\ &=& (1-3{u^2}+2{u^2}){P_0} + (3{u^2}-2{u^3}){P_1} + (u-2{u^2}+{u^3}){{P^\prime}_0} + (-{u^2}+{u^3}){{P^\prime}_1} \\ &=& \begin{bmatrix} 1 - 3{u^2} + 2{u^2} & 3{u^2} - 2{u^3} & u - 2{u^2} + {u^3} & -{u^2} + {u^3} \end{bmatrix}  \begin{bmatrix} P_0 \\ P_1 \\ {{P^\prime}_0} \\ {{P^\prime}_1} \end{bmatrix} \\ &=& \begin{bmatrix}u^3 & u^2 & u^1 & 1 \end{bmatrix} \begin{bmatrix} 2 & -2 & 1 & 1 \\ -3 & 3 & -2 & -1 \\ 0 & 0 & 1 & 0 \\ 1 & 0 & 0 & 0 \end{bmatrix} \begin{bmatrix} P_0 \\ P_1 \\ {{P^\prime}_0} \\ {{P^\prime}_1} \end{bmatrix} \end{array}$


수식이 장황했지만, 결과적으로 행렬 3개를 얻었습니다. u의 n차들로 이루어진 행렬, 상수들로 이루어진 4 by 4 행렬 그리고 $P_0, P_1, {{P^\prime}_0}, {{P^\prime}_1}$로 이루어진 행렬이 있습니다. 이 행렬들의 곱으로 곡선의 함수를 표현했습니다.


$u$는 결국 $0 \le u \le 1$이고 우리가 채워 넣어야 할 두 점 사이를 의미합니다. 상수들의 행렬은 조절할 수도 필요도 없겠죠. 그렇다면 우리는 $P_0, P_1, {{P^\prime}_0}, {{P^\prime}_1}$로 이루어진 행렬을 조절해 $P(u)$를 조절할 수 있게 되었습니다.


각각의 변수를 살펴보면 $P_0, P_1$는 양 끝 점이고, ${{P^\prime}_0}, {{P^\prime}_1}$는 각각의 접선 벡터를 의미하므로 $P_0, P_1, {{P^\prime}_0}, {{P^\prime}_1}$를 가지고 3차 곡선을 만들 수 있게 되는 것입니다!


에르밋 커브를 순차적으로 만들어서 아래처럼 더 많은 Segment를 줄 수도 있습니다.




사전 설명이 좀 많았기 때문에 이번 파트는 여기까지 하도록 하겠습니다. 다음에는 근사를 이용해 곡선을 그리는 베지어 커브와 그 단점들을 극복하는 곡선들을 정리해 보도록 하겠습니다.