맨위로가기

베지에 곡선

"오늘의AI위키"는 AI 기술로 일관성 있고 체계적인 최신 지식을 제공하는 혁신 플랫폼입니다.
"오늘의AI위키"의 AI를 통해 더욱 풍부하고 폭넓은 지식 경험을 누리세요.

1. 개요

베지에 곡선은 컴퓨터 그래픽스에서 부드러운 곡선을 모델링하는 데 널리 사용되는 곡선으로, 제어점 집합에 의해 정의된다. 1912년 베른슈타인 다항식으로 수학적 기초가 확립되었으며, 1959년 시트로엥의 수학자 폴 드 카스텔자우에 의해 컴퓨터 지원 설계에 처음 적용되었다. 1960년대에는 르노의 엔지니어 피에르 베지에가 독립적으로 베지에 곡선을 개발하여 널리 알려지게 되었다. 베지에 곡선은 제어점의 볼록 껍질 안에 포함되며, 아핀 변환을 통해 곡선에 적용할 수 있다. 이차 및 삼차 베지에 곡선이 가장 일반적이며, 복잡한 모양을 위해 낮은 차수의 곡선이 합성되어 사용되기도 한다. 베지에 곡선은 컴퓨터 그래픽스, 애니메이션, 폰트 디자인, 로봇 공학 등 다양한 분야에서 활용되며, 유리 베지에 곡선은 원호와 같은 원뿔 곡선을 정확하게 나타내는 데 사용된다. 여러 개의 베지에 곡선을 연결한 복합 베지에 곡선은 세그먼트 간의 연결에 따라 연속성이나 매끄러움을 가질 수 있으며, 앵커 포인트, 방향 핸들, 방향선 등의 용어로 설명된다.

더 읽어볼만한 페이지

  • 보간법 - 선형 보간법
    선형 보간법은 두 점 사이의 값을 직선으로 추정하는 방법으로, 다양한 분야에서 활용되지만 비선형 데이터에는 정확도가 낮아 다른 방법으로 대체될 수 있다.
  • 보간법 - 보외법
    보외법은 수치 데이터가 없는 범위의 값을 추정하는 방법으로, 다양한 외삽 방법이 존재하며 데이터 생성 프로세스에 대한 사전 지식에 따라 적용 방법을 선택한다.
  • 곡선 - 선적분
    선적분은 스칼라장이나 벡터장의 곡선에 대한 적분으로, 함수의 종류와 곡선의 표현 방식에 따라 다양하게 정의되며, 물리학과 공학 등에서 활용된다.
  • 곡선 - 아스트로이드
    아스트로이드는 별 모양의 곡선으로, `x2/3 + y2/3 = a2/3` (a는 상수)로 표현되는 6차 실수 대수곡선이며, 매개변수 방정식, 페달 방정식 등 다양한 수학적 표현으로 나타낼 수 있고, 면적은 (3/8)πa², 둘레는 6a이며, 원 내부에서 작은 원이 구르며 생기는 자취로도 설명된다.
  • 컴퓨터 그래픽스 - 딥페이크
    딥페이크는 인공지능 기술을 활용하여 영상이나 이미지를 조작, 합성하여 실제와 구별하기 어렵게 만드는 기술이며, 가짜 뉴스, 명예훼손, 신원 위장 등 다양한 문제점을 야기한다.
  • 컴퓨터 그래픽스 - 엔비디아
    엔비디아는 1993년 설립된 미국의 반도체 회사로, GeForce 256을 통해 GPU라는 용어를 대중화하고 딥러닝 기술 발전에 힘입어 인공지능 및 자율주행 분야에서 시장을 선도하며 성장하여 2024년 6월에는 시가총액 세계 1위 기업에 올랐다.
베지에 곡선

2. 역사

베지에 곡선은 프랑스자동차 제조사 시트로엥사의 폴 드 카스텔요|드 카스텔요프랑스어르노사의 피에르 베지에에 의해 독립적으로 고안되었다. 드 카스텔요가 먼저 개발했지만, 그의 논문이 공표되지 않아 베지에의 이름이 붙여졌다.[67]

2. 1. 발명

베지에 곡선의 수학적 기초는 1912년 베른슈타인 다항식으로 확립되었지만, 실제로 그래픽에 적용된 것은 약 50년 후였다.[6] 1959년 프랑스 자동차 제조사 시트로엥의 수학자 폴 드 카스텔자우가 곡선을 평가하기 위한 드 카스텔자우 알고리즘을 개발하면서부터이다. 이 알고리즘은 수치적으로 안정적인 방법이었다.[6] 드 카스텔자우의 방법은 프랑스에서 특허를 받았지만 1980년대까지 공개되지 않았다.[7] 1960년대에는 프랑스의 엔지니어 피에르 베지에르노에서 자동차 차체 설계에 베지에 곡선을 독립적으로 발견하고 사용하면서 널리 알려지게 되었다.[6]

베지에 곡선은 프랑스의 자동차 제조사 시트로엥사의 폴 드 카스텔요|드 카스텔요프랑스어르노사의 피에르 베지에에 의해 독립적으로 고안되었다. 드 카스텔요가 먼저 개발했지만, 그의 논문이 공표되지 않아 베지에의 이름이 붙여졌다.[67]

3. 정의

베지에 곡선은 여러 개의 제어점에 의해 정의되는 매개변수 곡선이다. 제어점의 개수에 따라 곡선의 차수가 결정되며, 일반적으로 2차, 3차 베지에 곡선이 널리 사용된다.

베지에 곡선은 '''P'''0부터 '''P'''''n''까지의 제어점 집합에 의해 정의되며, 여기서 ''n''은 곡선의 차수이다(선형의 경우 ''n'' = 1, 2차의 경우 2, 3차의 경우 3 등). 첫 번째와 마지막 제어점은 항상 곡선의 끝점이지만, 중간 제어점은 일반적으로 곡선 위에 있지 않다. 아핀 결합에서는 계수의 합은 1이다.

다음 요소를 전제로 한다.


  • 차수: N \in \Bbb{N}
  • 매개변수: t \in \Bbb{R}, \ 0 \leq t \leq 1
  • 제어점: N+1개의 벡터 \{

\mathbf{B}_i

\ | \

i \in \{0, 1, ..., N \}

\}

이들을 사용하여 N차 베지어 곡선 \mathbf{P}(t)는 여러 표현으로 정의된다.

3. 1. 일반적인 정의

n차 베지에 곡선은 n+1개의 제어점 \mathbf{P}_0, \mathbf{P}_1, ..., \mathbf{P}_n에 의해 정의된다. 이 곡선은 다음과 같은 재귀적 정의로 표현할 수 있다.

:\mathbf{B}_{\mathbf{P}_0}(t) = \mathbf{P}_0 이고,

:\mathbf{B}(t) = \mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_n}(t) = (1-t)\mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_{n-1}}(t) + t\mathbf{B}_{\mathbf{P}_1\mathbf{P}_2\ldots\mathbf{P}_n}(t)

즉, 차수가 n-1인 두 베지에 곡선에서 대응되는 점들을 선형 보간하여 얻어진다.

또한, 다음과 같이 명시적인 형태로도 표현할 수 있다.

:\mathbf{B}(t) = \sum_{i=0}^n {n\choose i}(1 - t)^{n - i}t^i\mathbf{P}_i = (1 - t)^n\mathbf{P}_0 + {n\choose 1}(1 - t)^{n - 1}t\mathbf{P}_1 + \cdots + {n\choose n - 1}(1 - t)t^{n - 1}\mathbf{P}_{n - 1} + t^n\mathbf{P}_n (단, 0 \leqslant t \leqslant 1)

여기서 \scriptstyle {n \choose i}이항 계수이다.

예를 들어, n = 5일 때는 다음과 같다.

:\mathbf{B}(t) = (1 - t)^5\mathbf{P}_0 + 5t(1 - t)^4\mathbf{P}_1 + 10t^2(1 - t)^3 \mathbf{P}_2 + 10t^3 (1-t)^2 \mathbf{P}_3 + 5t^4(1-t) \mathbf{P}_4 + t^5 \mathbf{P}_5 (단, 0 \leqslant t \leqslant 1)

베지에 곡선은 베른슈타인 다항식을 기저 함수로 사용하여 표현할 수도 있다.

:\mathbf{B}(t) = \sum_{i=0}^n b_{i, n}(t)\mathbf{P}_i (단, 0 \le t \le 1)

여기서 b_{i,n}(t) = {n \choose i} t^i (1 - t)^{n - i}는 n차 베른슈타인 기저 다항식이다.[36]

이러한 베지에 곡선의 정의는 "베지어 곡선의 번스타인 표현"이라고도 불린다.[37][38]

번스타인 기저 함수 J_{N,j}(t)를 사용하면, N차 베지어 곡선은 다음과 같이 정의된다.[36]

:\mathbf{P}(t) = \sum_{i=0}^{N} \mathbf{B}_i J_{N,i}(t) = \sum_{i=0}^{N} \mathbf{B}_i {N \choose i} t^i (1-t)^{N-i}

점 '''P'''''i''는 베지에 곡선의 ''제어점''이라고 하며, 이 점들을 선분으로 연결하여 형성된 다각형은 ''베지어 다각형''(또는 ''제어 다각형'')이라고 한다. 베지어 다각형의 볼록 껍질은 베지어 곡선을 포함한다.

3. 2. 2차 베지에 곡선

조절점 '''A''', '''B''', '''C'''에 대한 2차 베지에 곡선은 다음과 같이 정의되는 점 '''P'''(''t'')의 자취이다.

:\mathbf{P}(t) = (1 - t)^{2}\mathbf{A} + 2t(1 - t)\mathbf{B} + t^{2}\mathbf{C}\quad \text{단 , }\ 0\leq t \leq 1

위 식을 바꾸어 보면 베지에 곡선의 기하학적 의미를 다음과 같이 설명할 수 있다.

:\mathbf{P}(t) = (1 - t)\{(1 - t) \mathbf{A} + t \mathbf{B}\} + t\{(1 - t)\mathbf{B} + t \mathbf{C}\}\quad \text{단 , }\ 0\leq t \leq 1

여기서 첫 번째 괄호로 묶인 (1 -t) '''A''' + t '''B'''는 '''A'''와 '''B'''를 잇는 선분을 t:(1-t) 로 나누는 내분점임을 알 수 있고, 두 번째 괄호로 묶인 점도 마찬가지로 '''B'''와 '''C'''의 t:(1-t) 내분점이다. 그리고 '''P'''('''t''')는 이 두 내분점을 다시 t:(1-t) 로 나누는 내분점이다.

2차 베지에 곡선은 다음과 같이 재귀적인 방식으로 구성될 수 있다.

1. '''A''', '''B''', '''C'''를 각각 시작점, 조절점, 끝점이라고 하자.

2. 선분 '''AB'''의 중점을 '''D'''라고 한다.

3. 선분 '''BC'''의 중점을 '''E'''라고 한다.

4. 선분 '''DE'''의 중점을 '''F'''라고 하면, '''F'''는 베지에 곡선상의 점이다.

5. '''A''' = A''', '''B''' = '''D''', '''C ='''F''' 로 치환하여 위 조작을 반복한다.

6. '''A''' = F''', '''B''' = '''E''', '''C ='''C''' 로 치환하여 위 조작을 반복한다.

끈 예술의 이차 베지어 곡선: 끝점 ('''•''')과 제어점 ('''×''')은 이차 베지어 곡선 ('''⋯''')을 정의한다.


2차 베지에 곡선은 점 '''P'''0, '''P'''1, '''P'''2가 주어졌을 때, 다음 함수 '''B'''(''t'')에 의해 그려지는 경로이다.

:\mathbf{B}(t) = (1 - t)[(1 - t) \mathbf P_0 + t \mathbf P_1] + t [(1 - t) \mathbf P_1 + t \mathbf P_2],\ 0 \le t \le 1

이는 각각 '''P'''0에서 '''P'''1까지, 그리고 '''P'''1에서 '''P'''2까지의 선형 베지에 곡선 상의 해당 점들의 선형 보간으로 해석될 수 있다. 위의 식을 재정렬하면 다음과 같다.

:\mathbf{B}(t) = (1 - t)^{2}\mathbf{P}_0 + 2(1 - t)t\mathbf{P}_1 + t^{2}\mathbf{P}_2,\ 0 \le t \le 1

이는 '''P'''1에 대한 대칭성을 강조하는 방식으로 쓸 수 있다.

:\mathbf{B}(t) = \mathbf{P}_1+(1 - t)^{2}(\mathbf{P}_0 - \mathbf{P}_1) + t^{2}(\mathbf{P}_2-\mathbf{P}_1),\ 0 \le t \le 1

이로부터 바로 베지에 곡선의 ''t''에 대한 도함수를 얻을 수 있다.

:\mathbf{B}'(t) = 2 (1 - t) (\mathbf{P}_1 - \mathbf{P}_0) + 2 t (\mathbf{P}_2 - \mathbf{P}_1)

이를 통해 '''P'''0과 '''P'''2에서의 곡선에 대한 접선이 '''P'''1에서 교차한다는 것을 알 수 있다. ''t''가 0에서 1로 증가함에 따라 곡선은 '''P'''1 방향으로 '''P'''0에서 출발하여, '''P'''1 방향에서 '''P'''2에 도달하도록 굽어진다.

베지에 곡선의 ''t''에 대한 이계 도함수는 다음과 같다.

:\mathbf{B}''(t) = 2(\mathbf{P}_2 - 2 \mathbf{P}_1 + \mathbf{P}_0)

이차 베지에 곡선과 포물선 부분의 등가성


이차 베지에 곡선은 또한 포물선의 일부이다. 포물선은 원뿔 곡선이므로 일부 자료에서는 이차 베지에 곡선을 "원뿔 호"라고 부른다.[32] 오른쪽 그림을 참조하면, 포물선의 중요한 특징은 다음과 같이 유도할 수 있다.[12]

1. 곡선의 끝점(A와 B)에서 포물선에 대한 접선은 제어점(C)에서 교차한다.

2. D가 AB의 중점이면, CD에 수직인 곡선에 대한 접선(청록색 파선)이 꼭짓점(V)을 정의한다. 대칭축(청록색 쇄선)은 V를 지나고 접선에 수직이다.

3. E는 CD에 대해 45°의 접선을 갖는 곡선 위의 점이다(녹색 파선). G가 이 접선과 축의 교차점이면, G를 지나 CD에 수직인 선이 준선이다(녹색 실선).

4. 초점(F)은 축과 E를 지나 CD에 수직인 선의 교차점에 있다(노란색 점선). 랫터스 렉텀은 곡선 내의 선분이다(노란색 실선).

quadratic Bézier curve영어은 3개의 제어점으로 구성된 베지에 곡선이다.

2차 베지에 곡선은 다음 식으로 정의된다.[42]

:\begin{align}

\mathbf{P}(t)

& = \sum_{i=0}^2 \mathbf{B}_i J_{2,i}(t) \\

& = (1-t)^2 \mathbf{B}_0 + 2 t (1-t) \mathbf{B}_1 + t^2 \mathbf{B}_2 \\

& = ( \mathbf{B}_0 - 2 \mathbf{B}_1 + \mathbf{B}_2) t^2 + (-2 \mathbf{B}_0 + 2 \mathbf{B}_1) t + \mathbf{B}_0 \\

\end{align}

위 식으로부터 베지에 곡선의 성질을 만족함을 쉽게 확인할 수 있다. ''t''의 차수로부터 2차 베지에 곡선은 기껏해야 2차 곡선임을 확인할 수 있으며, 대입을 통해 '''P'''(0) = '''B'''0과 '''P'''(1) = '''B'''2에서 양 끝 제어점을 지남을 확인할 수 있다.

3. 3. 3차 베지에 곡선

3차 베지에 곡선은 4개의 점 '''P'''0, '''P'''1, '''P'''2, '''P'''3으로 정의된다. 곡선은 '''P'''0에서 시작하여 '''P'''1 방향으로 향하고, '''P'''2 방향에서 와서 '''P'''3에 도착한다. 일반적으로 '''P'''1 또는 '''P'''2를 통과하지 않으며, 이 점들은 방향 정보를 제공하기 위해서만 존재한다. '''P'''1과 '''P'''2 사이의 거리는 곡선이 '''P'''2 방향으로 꺾이기 전에 '''P'''1 방향으로 "얼마나 멀리" 그리고 "얼마나 빨리" 움직이는지를 결정한다.[9]

3차 베지에 곡선은 다음과 같은 식으로 표현할 수 있다.[9]

:\mathbf{B}(t) = (1-t)^3\mathbf{P}_0+3(1-t)^2t\mathbf{P}_1+3(1-t)t^2\mathbf{P}_2+t^3\mathbf{P}_3,\ 0 \le t \le 1.

'''P'''1과 '''P'''2를 적절히 선택하면 곡선이 자기 자신과 교차하거나 첨점을 포함할 수 있다.[9]

4개의 서로 다른 점의 임의의 시퀀스는 4개의 모든 점을 차례로 통과하는 3차 베지에 곡선으로 바꿀 수 있다. 어떤 3차 베지에 곡선의 시작점과 끝점, 그리고 ''t'' = 1/3 및 ''t'' = 2/3에 해당하는 곡선 위의 점들이 주어지면, 원래 베지에 곡선의 제어점을 복구할 수 있다.[9]

''t''에 대한 3차 베지에 곡선의 도함수는 다음과 같다.[9]

:\mathbf{B}'(t) = 3(1-t)^2(\mathbf{P}_1 - \mathbf{P}_0) + 6(1-t)t(\mathbf{P}_2 - \mathbf{P}_1) + 3t^2(\mathbf{P}_3 - \mathbf{P}_2) \,.

''t''에 대한 베지어 곡선의 이계 도함수는 다음과 같다.[9]

:\mathbf{B}''(t) = 6(1-t)(\mathbf{P}_2 - 2 \mathbf{P}_1 + \mathbf{P}_0) + 6t(\mathbf{P}_3 - 2 \mathbf{P}_2 + \mathbf{P}_1) \,.

4. 성질


  • 곡선은 \mathbf P_0에서 시작하여 \mathbf P_n에서 끝난다. 이것은 '끝점 보간' 속성이라고 불린다.
  • 곡선은 모든 제어점이 공선일 경우에만 선이다.
  • 곡선의 시작과 끝은 각각 베지어 다각형의 첫 번째와 마지막 부분에 접선이다.
  • 곡선은 임의의 지점에서 두 개의 하위 곡선 또는 임의의 많은 하위 곡선으로 분할할 수 있으며, 각 하위 곡선도 베지어 곡선이다.
  • 과 같이 단순해 보이는 일부 곡선은 베지어 또는 구간별 베지어 곡선으로 정확하게 설명할 수 없다. 비록 4조각 세제곱 베지어 곡선은 원을 근사할 수 있으며(복합 베지어 곡선 참조), 각 내부 제어점(또는 오프라인 점)이 단위 원의 외부 제어점으로부터 가로 또는 세로로 \textstyle\frac{4\left(\sqrt {2}-1\right)}{3} 거리에 있을 때 천 분의 일 미만의 최대 반경 오차를 갖는다. 더 일반적으로, 각 내부 제어점이 단위 원의 외부 제어점에서 \textstyle\frac{4}{3}\tan(t/4) 거리에 있을 때, ''n'' 조각 세제곱 베지어 곡선은 원을 근사할 수 있으며, 여기서 t = 2\pi/n(즉, t=360^\circ/n)이고, n>2이다.
  • 모든 이차 베지어 곡선은 세제곱 베지어 곡선이며, 더 일반적으로, 모든 ''n''차 베지어 곡선은 ''m'' > ''n''에 대해 ''m''차 곡선이다.
  • 베지어 곡선은 변동 감소 속성을 갖는다. 이것은 베지어 곡선이 제어점의 다각형보다 더 많이 "요동치지" 않으며, 실제로 그보다 덜 "요동칠" 수 있다는 것이다.[10]
  • ''n''차 베지어 곡선에는 국소 제어가 없다. 즉, 제어점에 대한 변경은 곡선 전체의 측면을 다시 계산하고 영향을 미쳐야 하지만, "변경된 제어점으로부터 멀리 떨어져 있을수록 곡선의 변화는 작아집니다".[11]
  • 2차보다 높은 차수의 베지어 곡선은 제어점을 특정 방식으로 선택하면 자체적으로 교차하거나 첨점을 가질 수 있다.
  • N차 베지어 곡선의 시작점은 끝점의 제어점 \mathbf{B}_0과, 종점은 다른 쪽 끝점의 제어점 \mathbf{B}_{N}과 일치한다.


번스타인 기저 함수는 J_{N,i}(0) = \delta_{i,0}, J_{N,i}(1) = \delta_{i,N}이다(⇒번스타인 다항식#번스타인 기저 함수의 특성). 따라서 베지어 곡선을 구성하는 대부분의 항은 단점에서 0이 되며 \mathbf{P}(0)=\mathbf{B}_0 1, \mathbf{P}(1)=\mathbf{B}_{N} 1이 된다. 즉, 시작점 \mathbf{P}(0) \mathbf{B}_0과, 종점 \mathbf{P}(1) \mathbf{B}_N과 일치한다.

베지어 곡선은 제어점 좌표의 가중 평균으로 간주할 수 있다.

번스타인 기저 함수는 항상 합이 1이며 (⇒번스타인 다항식#1의 분할)[40], 또한 0 \leq t \leq 1에서 비음수이다 (⇒번스타인 다항식#구간 비음수). 따라서 베지어 곡선상의 점 \mathbf{P}(t=T)는 각 제어점 \mathbf{B}_i J_{n, i}(T)로 가중된 가중 평균으로 간주할 수 있다.[41][40] 이러한 의미에서 각 번스타인 기저 함수는 혼합비라고도 불린다.[40]

베지어 곡선의 [단점]을 제외한 영역은 해당 좌표가 모든 제어점의 좌표로부터 영향을 받는다.

베지어 곡선은 제어점 좌표의 가중 평균이며(⇒#제어점의 가중 평균), 그 가중치인 번스타인 기저 함수는 0 < t < 1에서 항상 양수이다(⇒번스타인 다항식#구간 양수). 따라서 [단점] 이외의 지점에서는 모든 제어점의 좌표가 크든 작든 곡선의 각 점에 반영된다. [단점]은 예외이며, 단일 제어점의 좌표에 의해서만 결정된다.

베지어 곡선은 일반적으로 양 끝점을 제외한 제어점은 통과하지 않는다.

5. 구성

드 카스텔조 알고리즘을 사용하면 베지에 곡선을 구성할 수 있다. 이 알고리즘은 선형 보간을 반복하여 곡선 위의 점을 계산하는 방식이다.

차수 ''n''의 베지에 곡선은 차수 ''n'' − 1의 두 베지에 곡선에서 대응되는 점들의 쌍의 점대점 선형 결합으로 표현할 수 있다.

'''P'''0, '''P'''1, ..., '''P'''''k''의 점들로 결정되는 베지에 곡선을 \mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_k}로 표기하면, 다음과 같이 재귀적으로 정의할 수 있다.

:\mathbf{B}_{\mathbf{P}_0}(t) = \mathbf{P}_0 \text{, 그리고}

:\mathbf{B}(t) = \mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_n}(t) = (1-t)\mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_{n-1}}(t) + t\mathbf{B}_{\mathbf{P}_1\mathbf{P}_2\ldots\mathbf{P}_n}(t)

이를 공식으로 표현하면 다음과 같다. 여기서 \scriptstyle {n \choose i}이항 계수이다.

:\begin{align}

\mathbf{B}(t) &= \sum_{i=0}^n {n\choose i}(1 - t)^{n - i}t^i\mathbf{P}_i \\

&=(1 - t)^n\mathbf{P}_0 + {n\choose 1}(1 - t)^{n - 1}t\mathbf{P}_1 + \cdots + {n\choose n - 1}(1 - t)t^{n - 1}\mathbf{P}_{n - 1} + t^n\mathbf{P}_n, && 0 \leqslant t \leqslant 1

\end{align}

예를 들어, ''n'' = 5일 때 베지에 곡선은 다음과 같다.

:\begin{align}

\mathbf{B}(t) &= (1 - t)^5\mathbf{P}_0 + 5t(1 - t)^4\mathbf{P}_1 + 10t^2(1 - t)^3 \mathbf{P}_2 + 10t^3 (1-t)^2 \mathbf{P}_3 + 5t^4(1-t) \mathbf{P}_4 + t^5 \mathbf{P}_5, && 0 \leqslant t \leqslant 1.

\end{align}

벡터 \mathbf{B}_i^r(t)

에 관한 점화식을 정의하여 드 카스텔조 알고리즘을 표현할 수 있다.[39]

:\mathbf{B}_i^r(t) =

\begin{cases}

\mathbf{B}_i(t),

& r = 0,

& i \in \{0, 1, ..., N\} \\

(1-t) \mathbf{B}_i^{r-1}(t) + t \mathbf{B}_{i+1}^{r-1}(t),

& r \in \{1, ..., N\},

& i \in \{0, 1, ..., N-r\} \\

\end{cases}



이 점화식을 사용하여 N차 베지에 곡선은 \mathbf{P}(t) = \mathbf{B}_0^N(t)로 정의된다.

조절점 '''A''', '''B''', '''C'''를 이용하여 2차 베지에 곡선을 구성하는 방법은 다음과 같다. 선분 '''AB'''의 중점을 '''D''', 선분 '''BC'''의 중점을 '''E'''라고 하고, 선분 '''DE'''의 중점을 '''F'''라고 하면, '''F'''는 베지에 곡선상의 점이 된다. 이후 '''A''' = A''', '''B''' = '''D''', '''C ='''F''' 로 치환하거나, '''A''' = F''', '''B''' = '''E''', '''C ='''C''' 로 치환하여 위 조작을 반복한다.

5. 1. 2차 곡선 구성

제어점 '''P'''0, '''P'''1, '''P'''2가 주어졌을 때, 2차 베지에 곡선은 다음과 같이 구성된다.

  • 점 '''Q'''0(''t'')는 '''P'''0에서 '''P'''1까지 변화하며, 선형 베지에 곡선을 나타낸다.
  • 점 '''Q'''1(''t'')는 '''P'''1에서 '''P'''2까지 변화하며, 선형 베지에 곡선을 나타낸다.
  • 점 '''B'''(''t'')는 '''Q'''0(''t'')에서 '''Q'''1(''t'') 사이에서 선형 보간되며, 2차 베지에 곡선을 나타낸다.


이차 베지어 곡선 구성
이차 베지어 곡선 애니메이션, t는 [0,1] 범위에 있음
이차 베지어 곡선 구성이차 베지어 곡선 애니메이션, t는 [0,1] 범위에 있음



2차 베지에 곡선은 점 '''P'''0, '''P'''1, '''P'''2가 주어졌을 때, 다음 함수 '''B'''(''t'')에 의해 그려지는 경로이다.

:\mathbf{B}(t) = (1 - t)[(1 - t) \mathbf P_0 + t \mathbf P_1] + t [(1 - t) \mathbf P_1 + t \mathbf P_2],\ 0 \le t \le 1

이는 각각 '''P'''0에서 '''P'''1까지, 그리고 '''P'''1에서 '''P'''2까지의 선형 베지에 곡선 상의 해당 점들의 선형 보간으로 해석될 수 있다.

5. 2. 고차 곡선 구성

고차 곡선은 더 많은 중간점을 필요로 한다. 3차 곡선의 경우, 선형 베지에 곡선을 설명하는 중간점 '''Q'''0, '''Q'''1, '''Q'''2를 구성할 수 있으며, 2차 베지에 곡선을 설명하는 점 '''R'''0 및 '''R'''1을 구성할 수 있다.

3차 베지에 곡선의 구성
3차 베지에 곡선의 애니메이션, t는 [0,1
]
3차 베지에 곡선의 구성3차 베지에 곡선의 애니메이션, t는 [0,1]



4차 곡선의 경우, 선형 베지에 곡선을 설명하는 중간점 '''Q'''0, '''Q'''1, '''Q'''2, '''Q'''3을 구성할 수 있으며, 2차 베지에 곡선을 설명하는 점 '''R'''0, '''R'''1, '''R'''2와 3차 베지에 곡선을 설명하는 점 '''S'''0 및 '''S'''1을 구성할 수 있다.

4차 베지에 곡선의 구성
4차 베지에 곡선의 애니메이션, t는 [0,1
]
4차 베지에 곡선의 구성4차 베지에 곡선의 애니메이션, t는 [0,1]



5차 곡선의 경우, 유사한 중간점을 구성할 수 있다.

5차 베지에 곡선 구성의 애니메이션
5차 베지에 곡선의 애니메이션, t는 [0,1]에서 빨간색으로 표시됨. 각 하위 차수의 베지에 곡선도 표시됩니다.



이러한 표현은 드 카스텔요 알고리즘에서 베지에 곡선을 계산하는 데 사용되는 프로세스에 기반한다.[13]

6. 응용

베지에 곡선은 컴퓨터 그래픽스, 애니메이션, 폰트 디자인, 로봇 공학 등 다양한 분야에서 활용된다.


  • 컴퓨터 그래픽스: 드로잉 소프트웨어에서 윤곽선을 표현하거나, 페인트 소프트웨어에서 손글씨 선을 보정하는 데 사용된다.[58]
  • 애니메이션: 어도비 플래시나 신픽 같은 프로그램에서 움직이는 경로를 표현하는 데 사용된다.
  • 폰트: 트루타입 글꼴처럼 곡선으로 이루어진 글자 모양을 만드는 데 사용된다.
  • 기타: 산업 디자인에서 설계 도면 속 물체를 표현하거나, GUI에서 그래프 형태의 설정값을 나타내는 데에도 사용된다.


2차 베지에 곡선과 3차 베지에 곡선이 널리 사용되며, 특히 3차 베지에 곡선은 시작점과 끝점에서의 접선을 쉽게 조절할 수 있어 직관적이고 다루기 쉽다.

6. 1. 컴퓨터 그래픽스

베지에 곡선은 컴퓨터 그래픽스에서 부드러운 곡선을 모델링하는 데 널리 사용된다. 곡선은 제어점의 볼록 껍질 안에 완전히 포함되어 있으므로, 점을 그래픽으로 표시하고 곡선을 직관적으로 조작하는 데 사용할 수 있다. 아핀 변환 (예: 이동 및 회전)은 곡선의 제어점에 해당 변환을 적용하여 곡선에 적용할 수 있다.

이차 함수삼차 함수 베지에 곡선이 가장 일반적이다. 고차 곡선은 평가하기가 더 계산 비용이 많이 든다. 더 복잡한 모양이 필요할 때는 낮은 차수의 베지에 곡선이 함께 패치되어 합성 베지에 곡선을 생성한다. 합성 베지에 곡선은 일반적으로 벡터 그래픽 언어 (예: 포스트스크립트), 벡터 그래픽 표준 (예: SVG) 및 벡터 그래픽 프로그램 (예: 아트라인, 타임웍스 퍼블리셔, 어도비 일러스트레이터, 코렐 드로우, 잉크스케이프, 알레그로)에서 "경로"라고 한다. 두 개의 구성 베지에 곡선이 만나는 제어점이 양쪽에 있는 두 개의 제어점으로 정의된 선에 놓이도록 하는 ''G1 연속성''이라는 속성이 있어서 꺾임 없이 베지에 곡선을 합성 베지에 곡선으로 결합할 수 있다.[24]

6. 2. 애니메이션

어도비 플래시와 신픽 같은 애니메이션 응용 프로그램에서 베지에 곡선은 움직임을 표현하는 데 사용된다. 사용자가 베지에 곡선으로 원하는 경로를 그리면, 응용 프로그램은 객체가 해당 경로를 따라 이동하는 데 필요한 프레임을 생성한다.[28][29]

3D 애니메이션에서 베지에 곡선은 3D 경로와 키프레임 보간을 위한 2D 곡선을 정의하는 데 자주 사용된다.[30] 베지에 곡선은 현재 CSS, 자바스크립트, JavaFX 및 플러터 SDK에서 애니메이션의 이징(easing)을 제어하는 데 매우 자주 사용된다.[4]

양 끝점 P0, P3 및 제어점 P1, P2로 구성된 3차 베지어 곡선

6. 3. 폰트

트루타입 글꼴은 이차 베지에 곡선으로 구성된 복합 베지에 곡선을 사용한다. 포스트스크립트, 아심토트, 메타폰트, SVG와 같은 다른 언어 및 이미지 도구는 곡선 모양을 그리기 위해 삼차 베지에 곡선으로 구성된 복합 베지에 곡선을 사용한다. 오픈타입 글꼴은 오픈타입 래퍼의 기반이 되는 글꼴 기술에 따라 두 종류의 곡선을 모두 사용할 수 있다.[31]

FreeType과 같은 글꼴 엔진은 글꼴 래스터화라고 하는 프로세스를 사용하여 글꼴의 곡선(및 선)을 픽셀화된 표면에 그린다.[32]

6. 4. 로봇 공학

제어 다각형을 통해 경로가 장애물과 충돌하는지 여부를 알 수 있기 때문에, 베지에 곡선은 엔드 이펙터의 궤적을 생성하는 데 사용된다.[34] 또한, 조인트 공간 궤적은 베지에 곡선을 사용하여 정확하게 미분될 수 있다. 결과적으로, 조인트 공간 궤적의 도함수는 로봇 매니퓰레이터의 동역학 및 제어 노력(토크 프로파일) 계산에 사용된다.[34]

7. 복합 베지에 곡선

'''복합 베지에 곡선'''(composite Bézier curve|컴포지트 베지에 커브영어)은 여러 개의 베지에 곡선을 연결하여 만든 곡선으로, '''베지에 스플라인'''(Bézier spline|베지에 스플라인영어)[46], '''폴리베지어 곡선'''(polybezier|폴리베지어영어)[45]이라고도 한다.

N차 베지에 곡선은 제어점을 추가하면 차수도 함께 증가하기 때문에 차수를 변경하지 않고는 연장할 수 없다. 또한, 새로운 제어점 좌표가 기존 구간에도 반영되는 전체 제어점의 반영 특성 때문에 기존 구간에 영향을 주지 않고는 연장할 수 없다.

이러한 문제를 해결하기 위해 스플라인 곡선과 같은 구분 다항식을 사용할 수 있다. 구분 다항식은 곡선 전체를 여러 개의 다항식으로 구성하여 각 구간을 독립적으로 표현한다. 복합 베지에 곡선은 베지에 곡선을 이용하여 각 구분을 표현한 구분 다항식이다.[46]

복합 베지에 곡선은 일반적으로 세그먼트 간 연결에 제약을 두지 않아 연속성이나 매끄러움이 보장되지 않는다.[47] 이는 B-스플라인 곡선과 같은 다른 스플라인 곡선과의 차이점이다. 그러나 적절한 제약을 가하면 연속성이나 매끄러움을 보장할 수 있다.

복합 베지에 곡선의 연속성은 세그먼트의 종점 제어점과 인접 세그먼트의 시작점 제어점을 공유함으로써 보장될 수 있다.[48] 이는 끝점과 끝 제어점의 일치 특성으로 확인할 수 있다. 또한, 세그먼트 간의 접선을 공유하도록 제약을 가하면 복합 베지에 곡선의 매끄러움을 보장할 수 있다.[49] 이는 매개변수에 대한 1차 미분이 단점에서 일치하는 것과 같다.[49]

7. 1. 용어 (3차 복합 베지에 곡선)

'''앵커 포인트'''(anchor point|앵커 포인트영어)는 세그먼트의 종점에 있는 제어점의 다른 이름이다.[50] '''꼭짓점'''(vertex|꼭짓점영어), '''패스 포인트'''(path point|패스 포인트영어), '''통과점'''이라고도 한다.[51] 종점과 종점 제어점의 일치 특성으로 인해 베지어 곡선은 앵커 포인트 사이를 연결하는 곡선으로 간주할 수 있다. 세그먼트가 통과하지 않는 제어점(=방향 핸들)과의 구별을 직관적으로 하기 위해 이 용어가 도입되었다.

'''방향 핸들'''(direction handle|방향 핸들영어)은 세그먼트 끝점 옆에 있는 제어점의 별칭이다. '''방향점'''이라고도 한다.[52] 방향선의 끝에 위치한다. 앵커 포인트와 구별함으로써 직접 곡선을 통과하지 않지만 굽는 방식을 결정한다는 것을 직관적으로 이해할 수 있다.

'''방향선'''(direction line|방향선영어)은 세그먼트의 단점에서 인접한 제어점으로 뻗어 있는 직선이다.[53] 일본어로는 ほうこうせん(방향선)이라고 한다. 3차 베지어 곡선에서는 단점에서의 접선 벡터가 인접한 제어점으로 뻗어 있는 벡터와 같은 방향을 갖기 때문에(자세한 내용: #3차 베지어 곡선), 방향선의 개념을 도입하면 단점에서의 기울기와 인접 제어점(=방향 핸들)의 위치를 동시에 시각적으로 확인할 수 있다.

폴리 베지어 곡선은 매끄러움 보장에 제약을 필요로 한다(⇒#매끄러움 보장). 이는 각 앵커 포인트에서 뻗어 나오는 두 개의 방향선 사이에 어떤 제약을 가하는가에 따라 표현할 수 있다.

방향선이 좌우 대칭이면 접선이 일치하므로 반드시 매끄러워진다. 이 제약이 가해진 앵커 포인트를 '''스무스 포인트'''(smooth point|스무스 포인트영어)[54], 설정 자체를 '''대칭'''(symmetric|대칭영어)[55], '''곡선'''[56], '''스무스'''(smooth|스무스영어)[57][55] 등으로 칭한다.

8. 유리 베지에 곡선

유리 베지에 곡선은 가중치를 추가하여 곡선의 형태를 더 세밀하게 조정할 수 있도록 한다. 분자는 가중치가 적용된 번스타인 형식 베지에 곡선이고, 분모는 번스타인 다항식의 가중 합이다. 유리 베지에 곡선은 원호를 포함한 원뿔 곡선 세그먼트를 정확하게 나타내는 데 사용할 수 있다.[22]

''n'' + 1개의 제어점 '''P'''0, ..., '''P'''''n''이 주어지면, 유리 베지에 곡선은 다음과 같이 설명할 수 있다.

:

또는 간단히

:

이 표현식은 가중치에 실수 외의 숫자 체계를 사용하여 확장할 수 있다. 복소 평면에서 가중치가 {''i''}, {1}, {''-i''}인 점 {1}, {-1}, {1}은 반지름이 1인 완전한 원을 생성한다. 원 위의 점과 가중치를 갖는 곡선의 경우, 곡선의 모양을 변경하지 않고 가중치를 조정할 수 있다.[23] 위 곡선의 중앙 가중치를 1.35508로 조정하면 더 균일한 매개변수화가 제공된다.

참조

[1] 서적 Longman Pronunciation Dictionary Pearson Longman 2008-04-03
[2] 서적 Mathematics for Computer Graphics Applications https://books.google[...] Industrial Press Inc.
[3] 서적 Encyclopaedia of Mathematics: Supplement https://books.google[...] Springer Science & Business Media
[4] 웹사이트 Cubic class - animation library - Dart API https://api.flutter.[...] 2021-04-26
[5] 간행물 Multimodal Intelligent Eye-Gaze Tracking System 2015-04-03
[6] 서적 Handbook of Computer Aided Geometric Design https://books.google[...] Elsevier
[7] 서적 Mathématiques et CAO. Tome 2 : Formes à pôles Hermès 1986
[8] 서적 Stepping into Virtual Reality https://books.google[...] Springer Nature
[9] 웹사이트 Forcing Bezier Interpolation http://people.sc.fsu[...]
[10] 서적 Computing Handbook, Third Edition: Computer Science and Software Engineering https://books.google[...] CRC Press
[11] 서적 Computer Graphics and Geometric Modelling: Implementation & Algorithms https://books.google[...] Springer Science & Business Media
[12] 서적 Applied Geometry for Computer Graphics and CAD 2005
[13] 웹사이트 Finding a Point on a Bézier Curve: De Casteljau's Algorithm http://www.cs.mtu.ed[...] 2012-09-06
[14] 웹사이트 CS 354 Vector Graphics & Path Rendering http://www.slideshar[...] 2012-04-10
[15] 웹사이트 Introduction to Pythagorean-hodograph curves http://faculty.engin[...]
[16] 간행물 Comparing offset curve approximation methods http://3map.snu.ac.k[...] 1997-05
[17] 간행물 MetaFog: Converting Metafont shapes to contours https://www.tug.org/[...] 1995
[18] 서적 Curves and surfaces for computer-aided geometric design Elsevier Science & Technology Books
[19] 웹사이트 Bézier Splines https://fontforge.or[...]
[20] 간행물 Degree reduction of Bézier curves 1993-08
[21] conference Mathematics and Computing 2018
[22] 웹사이트 Some Mathematical Elements of Graphics: Rational B-splines http://www.cl.cam.ac[...] 2000-09-25
[23] 간행물 Complex rational Bézier curves 2009-11
[24] 문서 Phantom Ray-Hair Intersector https://research.nvi[...] 2018-08-01
[25] 웹사이트 Complex Quadratic Bézier Curve on Unit Circle https://www.atlantis[...] School of Software, Zhengzhou University
[26] 서적 Metafont: The Program Addison-Wesley 1986
[27] 보고서 A Rasterizing Algorithm for Drawing Curves http://members.chell[...]
[28] 웹사이트 Using motion paths in animations https://www.adobe.co[...] 2019-04-11
[29] 웹사이트 Following a Spline https://wiki.synfig.[...] 2019-04-11
[30] 웹사이트 Advanced Graphics Lecture Notes https://www.cl.cam.a[...] University of Cambridge Computer Laboratory 1999
[31] 웹사이트 The difference between CFF and TTF https://www.linotype[...] Linotype 2018-07-03
[32] 웹사이트 FreeType Glyph Conventions / VI. FreeType outlines http://www.freetype.[...] 2018-02-13
[33] 웹사이트 smooth_curve_bezier_example_file.xls http://www.xlrotor.c[...] 2011-02-05
[34] 간행물 Trajectory Generation for a Multibody Robotic System using the Product of Exponentials Formulation https://arc.aiaa.org[...] 2021-01
[35] 서적 The Best Writing on Mathematics 2013 Princeton University Press 2014
[36] 書적
[37] 서적
[38] 서적
[39] 서적
[40] 서적
[41] 논문 制御点方式による曲線形状の生成 https://shinshu.repo[...] 長野大学紀要
[42] 서적
[43] 학위논문 パラメトリック曲線を用いたノンパラメトリック形状最適化法に関する研究 https://mie-u.repo.n[...] 三重大学学術機関リポジトリ
[44] 서적
[45] 문서 複合ベジェ曲線
[46] 논문 利用者の動作と連動する仮想ファッション https://www.interact[...] インタラクション2002論文集
[47] 강연자료 第6回 曲線・曲面の表現「Bスプライン曲線」 https://mitani.cs.ts[...] 筑波大学講義 コンピュータグラフィックス基礎
[48] 서적
[49] 서적
[50] 웹사이트 ベクトルグラフィックとラスター画像について https://helpx.adobe.[...] 2024-10-13
[51] 웹사이트 連続曲線サブツール・ベジェ曲線サブツール https://help.clip-st[...] 2024-10-13
[52] 웹사이트 連続曲線サブツール・ベジェ曲線サブツール https://help.clip-st[...] 2024-10-13
[53] 웹사이트 ベクトルグラフィックとラスター画像について https://helpx.adobe.[...] 2024-10-13
[54] 웹사이트 ベクトルグラフィックとラスター画像について https://helpx.adobe.[...] 2024-10-13
[55] 웹사이트 Tools » Shape Edit Tool https://docs.krita.o[...] 2024-10-13
[56] 웹사이트 連続曲線サブツール・ベジェ曲線サブツール https://help.clip-st[...] 2024-10-13
[57] 웹사이트 Scalable Vector Graphics (SVG) 2 https://www.w3.org/T[...] 2024-09-09
[58] 문서
[59] 웹사이트 Line and Curve Functions - Windows applications https://docs.microso[...]
[60] 웹사이트 ID2D1GeometrySink::AddBezier(const D2D1_BEZIER_SEGMENT) (d2d1.h) https://docs.microso[...]
[61] 웹사이트 D2D1_BEZIER_SEGMENT (d2d1.h) https://docs.microso[...]
[62] 웹사이트 GraphicsPath.AddBezier Method (System.Drawing.Drawing2D) https://docs.microso[...]
[63] 웹사이트 BezierSegment Class (System.Windows.Media) https://docs.microso[...]
[64] 웹사이트 Geometric Primitives (The Java™ Tutorials > 2D Graphics > Overview of the Java 2D API Concepts) https://docs.oracle.[...]
[65] 웹사이트 skia/SkPath.h at master · google/skia https://github.com/g[...]
[66] 웹사이트 Path https://developer.an[...]
[67] 서적 3次元CADの基礎と応用 共立出版



본 사이트는 AI가 위키백과와 뉴스 기사,정부 간행물,학술 논문등을 바탕으로 정보를 가공하여 제공하는 백과사전형 서비스입니다.
모든 문서는 AI에 의해 자동 생성되며, CC BY-SA 4.0 라이선스에 따라 이용할 수 있습니다.
하지만, 위키백과나 뉴스 기사 자체에 오류, 부정확한 정보, 또는 가짜 뉴스가 포함될 수 있으며, AI는 이러한 내용을 완벽하게 걸러내지 못할 수 있습니다.
따라서 제공되는 정보에 일부 오류나 편향이 있을 수 있으므로, 중요한 정보는 반드시 다른 출처를 통해 교차 검증하시기 바랍니다.

문의하기 : help@durumis.com