# 2026-07-15 유동 대시 진행방향 정렬 + 선형 튜브(지름 있는 원형 단면) 레일

**소요 시간**: 13분
**Context 사용량**: 작업분 input 200k / output 7k tokens · 누적 input 18000k / output 255k tokens

## 요청

1. 선형 애니메이션(유동 대시)이 '가는 방향'으로 흐르게
2. 선형을 지름 있는 입체 원형(튜브)으로

## 구현 — StationOverlay.tsx

### ① 대시 진행방향 정렬

- 선형 배열이 체이니지 감소 순(7k→0k)이라 대시가 역방향으로 흐르던 문제
- 드론 **실제 이동 벡터**(±3행 GPS 변위, 호버 시 yaw 폴백)와 세그먼트 방향의
  내적으로 각 세그먼트를 '뒤→앞'으로 정렬 → 역방향 비행에서도 항상 진행방향 흐름

### ② 튜브 레일 (원형 단면)

- 분할점(~15m) 사이 구간마다 화면 폭 = **지름(m) ÷ 거리 × 픽셀/라디안** —
  가까울수록 굵고 멀수록 가는 원근 지름 표현 (하한 1.5px, 상한 40px)
- **3중 스트로크 원통 음영**: 외곽(어두운 적, 1.0w) → 본체(적, 0.6w) →
  하이라이트(밝은 살구, 0.26w) — 둥근 파이프 질감. 라운드 캡으로 이음새 없음
- 옵션 **'선형 지름'**(display.json clTubeD, 기본 1.2m, 0.2~5m) — 입체 효과 켠
  상태에서 커튼 높이 아래 슬라이더. 입체 효과 끄면 종전 단순 선

## 반영

- 웹(index-L2DHv7Ep.js, 07.15 13:02) + 포터블(StationPlayer-Portable) 갱신
- 확인: F5 → 대시가 진행방향으로 흐르는지, 튜브가 가까울수록 굵어지는지