de Casteljau subdivision

cubic Bézier는 control polygon의 중점을 반복해서 잇는 것으로, 곡선 위의 점 B(t)와 곡선을 둘로 나누는 계산을 한 번에 줍니다. 008 cubicBezierPoint와 같은 기하입니다.

데모에서 볼 것

• toolbar split depth 0–4
• depth d → 2ᵈ개의 sub-cubic, 색이 구간마다 다름
• depth 0: 원래 한 곡선 (M 60 300 C 120 60 520 360 580 120)
• readout: left.p3 === right.p0 — 분할점이 곡선 위의 t = ½

t = ½에서 나누기

import { subdivideCubicBezier } from "svg-matrix-core";

const { left, right } = subdivideCubicBezier(p0, p1, p2, p3);
// left:  [p0, m01, m012, mid]
// right: [mid, m123, m23, p3]
// left.p3 === right.p0  (곡선 위 동일 점)

P0 ──m01── P1 ──m12── P2 ──m23── P3
      ╲      ╱         ╲      ╱
       m012            m123
          ╲          ╱
            mid  ← B(½)

임의 t 분할은 de Casteljau를 t와 1−t 비율로 일반화합니다. core는 ½만 export — adaptive·교차 알고리즘에 충분.

quadratic

import { subdivideQuadraticBezier } from "svg-matrix-core";

009 Q segment — flattenQuadraticAdaptive(engine.js)도 동일 패턴.

어디에 쓰이나

016 uniform flatten은 subdivide 없이 t = k/n만 샘플 — 다른 알고리즘.

재귀 직관

flattenCubicAdaptive:
  if mid→chord 거리 ≤ tolerance → 끝
  else subdivide → 왼쪽·오른쪽 각각 재귀

한 단계 재귀 = subdivideCubicBezier 한 번. depth 4 데모 ≈ tolerance를 매우 작게 준 adaptive의 “모든 구간을 쪼갠” 모습.

Core API

관련

• 069 언제 멈출지 · 052 path 전체 · 008 C

오늘의 핵심

de Casteljau는 “그리기”와 “쪼개기”가 같은 연산입니다. adaptive flatten·curve intersection의 재귀 한 단계가 바로 subdivideCubicBezier입니다.