핵심 요약
티빙이 9개 수치로 공 궤적을 재현하고 Three.js 기반의 3D 피치트레킹 리플레이를 구현해 ABS 존과 핫콜드존 정보를 시각화했습니다.
구현 방법
- WebGL 3D 시각화: Three.js + React Three Fiber, 포수 시점 카메라 고정, 깊이감 확보
- 물리 기반 궤적 재생: 9개 수치(x0 y0 z0; vx0 vy0 vz0; ax ay az)를 활용한 등가속도 운동으로 t를 계산하고 60등분 샘플링
- 좌표계 캘리브레이션: 물리 좌표 → 씬 좌표 → 픽셀 좌표로 매핑, 원점(스트라이크존 중심, 홈플레이트 깊이) 설정
주요 결과
- 145km/h 직구는 약 0.45초 만에 포수 미트 도달 재생
- 2배 슬로모션 적용 및 던지기 직전 0.5초의 뜸으로 리듬 형성
- 핫콜드존과 겹쳐 타자-투수의 수싸움을 직관적으로 파악 가능
