도구스개발

베지어 곡선 길이 계산기

3차 베지어 곡선의 제어점 네 개를 넣으면 호 길이를 수치적분으로 구합니다. 현의 길이·제어다각형 둘레와 나란히 보여 결과가 그 사이에 있는지 바로 검산할 수 있고, 진행률 t를 움직이며 부분 길이도 볼 수 있습니다.

시작점 P₀ · 끝점 P₃

제어점 P₁ · P₂

곡선 전체 길이

159.081045

실선이 베지어 곡선, 점선이 제어다각형(P₀-P₁-P₂-P₃)입니다. 좌표에 쓴 단위가 그대로 결과 단위가 됩니다.

호 길이 (합성 심프슨, 구간 2000개)159.081045
현의 길이 |P₃−P₀| (하한)141.421356
제어다각형 둘레 (상한)276.619038
호 길이 ÷ 현의 길이1.1249배

곡선 진행률로 부분 길이 보기

t 위치의 좌표(100, 100)
t=0부터 여기까지 누적 길이159.081045
전체 대비 진행률100%

사용 방법

  1. 1시작점 P₀와 끝점 P₃, 제어점 P₁·P₂의 좌표를 넣습니다.
  2. 2그림에서 실선이 베지어 곡선, 점선이 제어점을 잇는 제어다각형입니다.
  3. 3호 길이가 현의 길이(하한)와 제어다각형 둘레(상한) 사이에 있는지로 결과를 검산합니다.
  4. 4진행률 t를 0~1 사이로 움직이면 그 위치의 좌표와 거기까지의 누적 길이를 볼 수 있습니다.

자주 묻는 질문

L = ∫₀¹ |B'(t)| dt를 수치적분으로 근사합니다. B(t)가 t의 3차식이라 속도벡터 B'(t)는 2차식이고, 그 크기(|B'(t)|)는 2차식의 제곱근이라 일반적으로 초등함수로 적분되지 않습니다. 그래서 이 계산기를 포함해 SVG의 getTotalLength(), 그래픽 엔진 대부분이 수치적분([0,1]을 잘게 나눠 합성 심프슨 공식으로 근사)을 씁니다.

구간 2000개로 나눈 합성 심프슨 공식을 씁니다. 제어점이 겹쳐 곡선이 순간적으로 멈추는 첨점만 없다면 속도함수가 매끄러워 배정밀도 유효숫자 안에서 사실상 정확한 값이 나옵니다. 구간 수를 늘려도(예: 4000개) 결과가 거의 바뀌지 않는 것으로 수렴을 확인할 수 있습니다.

삼각부등식 때문에 호 길이는 항상 시작점-끝점 직선거리(현의 길이)보다 길거나 같고, 제어점을 순서대로 이은 꺾은선(제어다각형) 둘레보다 짧거나 같습니다. 계산 결과가 이 범위를 벗어나면 입력이나 계산에 문제가 있다는 뜻이라 검산 장치로 같이 보여줍니다.

SVG 패스나 CNC/플로터 경로의 실제 이동 거리를 재거나, 애니메이션을 곡선을 따라 일정한 속도로 움직이게 만들 때(등속 매개변수화) 필요합니다. 진행률 t=0.3처럼 매개변수 값과 실제 이동 거리는 비례하지 않기 때문에, "경로의 30% 지점"을 구하려면 전체 길이의 30%가 되는 t를 거꾸로 찾아야 하고 이때 누적 길이 함수가 필요합니다.

곡선이 실제로는 직선이 되어 호 길이가 현의 길이와 정확히 같아집니다. 「직선(퇴화)」 예제를 눌러 확인할 수 있습니다.

전송되지 않습니다. 모든 계산은 브라우저 안에서 이뤄지고, 입력값은 이 기기에만 남습니다.

알아두면 좋은 점

  • 좌표에 쓴 단위(px, mm, cm 등 무엇이든)가 그대로 결과 단위가 됩니다. 이 도구는 단위 변환을 하지 않습니다.
  • 수치적분은 합성 심프슨 공식(구간 2000개)을 씁니다. 네 제어점이 한 점으로 겹치면(곡선이 아니라 점) 길이 0으로 처리합니다.
  • 검증: 네 제어점을 일직선 위에 등간격으로 두면 곡선이 직선이 되어 길이가 현의 길이와 정확히 같은지, 무작위 제어점에서 호 길이가 항상 현의 길이 이상·제어다각형 둘레 이하인지, 제어점을 k배 하면 길이도 k배가 되는지, 시작-끝 순서를 뒤집어도 길이가 같은지를 자동 테스트로 확인했습니다.

함께 보면 좋은 도구

마지막 검증: 2026년 9월 6일 · 결과는 참고용 추정치입니다.