베지에 곡선
베지에 곡선
베지에 곡선이란?
베지에 곡선은 최소 2개 이상의 제어점 을 사용하여 만들어지는 곡선입니다.
제어점의 개수에 따라 곡선의 차수가 결정되며, 일반적으로는 다음과 같이 표현할 수 있습니다.
- 2개의 제어점: 1차 베지에 곡선
- 3개의 제어점: 2차 베지에 곡선
- 4개의 제어점: 3차 베지에 곡선
- …
- n개의 제어점: (n-1)차 베지에 곡선
이러한 곡선들은 이항정리(Binomial Theorem) 를 기반으로 정의할 수 있습니다.
즉,
여기서 $t$ 는 0과 1 사이의 값을 가지며, $t = 0$ 일 때 시작 제어점, $t = 1$ 일 때 종료 제어점에 해당합니다.
3차 베지어 곡선
많은 그래픽 프로그램에서는 시작점, 종료점, 시작 컨트롤 점, 종료 컨트롤 점 총 4개의 제어점을 사용하여 곡선을 표현합니다.
다음 그림은 3차 베지에 곡선의 제어점 구성을 보여줍니다.
4개의 제어점을 사용하기 때문에 이것을 3차 베지에 곡선이라고 부릅니다.
수학적 유도
3차 베지에 곡선은 $n = 3$ 인 경우의 이항정리를 이용하여 다음과 같이 전개할 수 있습니다.
우선,
\[\begin{align} & ((1 - t) + t)^3 \\ \\ & ((1 - t) + t)((1 - t) + t)((1 - t) + t) \\ \\ & (1 - t)^3 + 3(1-t)^2t + 3(1-t)t^2 + t^3 \end{align}\]여기서 각 항에 해당하는 계수를 제어점에 곱해주면,
\[\begin{align} & (1 - t)^3 + 3(1-t)^2t + 3(1-t)t^2 + t^3 \\ \\ & (1 - t)^3P_0 + 3(1-t)^2tP_1 + 3(1-t)t^2P_2 + t^3P_3 \end{align}\]1
2
3
4
- $P_0$ : 시작점
- $P_1$ : 시작 컨트롤 점
- $P_2$ : 종료 컨트롤 점
- $P_3$ : 종료점
이 공식을 사용하면 $t$ 의 값(0 ~ 1)에 따라 베지에 곡선 상의 점을 계산할 수 있습니다.
코드 구현 예제 (C#)
아래는 위의 3차 베지에 곡선 공식을 C# 코드로 구현한 예제입니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
public class BezierCurve
{
public static Vector2 Calculate2D(Vector2 start, Vector2 start_control, Vector2 end, Vector2 end_control, float t_value)
{
float t = Mathf.Clamp (t_value, 0.0f, 1.0f);
float tt = t * t;
float ttt = tt * t;
float u = 1.0f - t;
float uu = u * u;
float uuu = uu * u;
Vector2 p = uuu * start;
p += 3 * uu * t * start_control;
p += 3 * u * tt * end_control;
p += ttt * end;
return p;
}
}
이 함수는 매개변수 t_value (0 ~ 1)를 입력받아 해당 위치의 베지에 곡선상의 좌표를 계산해 줍니다.
이와 같이 베지에 곡선은 제어점과 t 값의 조합을 통해 부드러운 곡선을 생성할 수 있으며, 특히 3차 베지에 곡선은 다양한 그래픽 애플리케이션에서 널리 사용됩니다.
This post is licensed under CC BY 4.0 by the author.