feat: StationOverlay 렌더링 최적화 및 스무딩 적용 close #1
- 텍스트(측점/POI) 전 프레임 사전 계산 Map (requestIdleCallback 백그라운드) - 드론 데이터 이동 평균 스무딩 (smoothFrame ±N프레임) - 30fps→60fps 프레임 간 선형 보간 (performance.now() 기반) - EMA(지수이동평균) 표시 위치 스무딩 (α=0.01 기본값) - 글씨 2배 크기, bold, strokeText 테두리, 배경 박스 제거 - 카메라 파라미터 패널에 smooth/EMA α 슬라이더 추가 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
77
README.md
Normal file
77
README.md
Normal file
@@ -0,0 +1,77 @@
|
||||
# abcvideo
|
||||
|
||||
2GB 이상 대용량 동영상을 웹 브라우저에서 안정적으로 재생하는 특화 기능 탑재 플레이어.
|
||||
|
||||
## 기능
|
||||
|
||||
- 2GB+ 동영상 안정 재생 (로컬 파일 직접 재생 + 서버 Range Request/HLS)
|
||||
- 프레임 단위 추출 (Canvas 즉시 미리보기)
|
||||
- 키보드 단축키로 프레임/초/장면 단위 이동
|
||||
- 자막형 / 메모형 텍스트 오버레이 + VTT/SRT/JSON/CSV 내보내기
|
||||
- HLS 자동 변환 (FFmpeg 설치 시)
|
||||
|
||||
## 사전 요구사항
|
||||
|
||||
- Node.js 20+ LTS
|
||||
- FFmpeg (HLS 변환 및 프레임 정확 추출 시 필요)
|
||||
- Windows: https://ffmpeg.org/download.html 에서 다운로드 후 PATH 등록
|
||||
- macOS: `brew install ffmpeg`
|
||||
- Ubuntu: `sudo apt install ffmpeg`
|
||||
|
||||
## 설치 및 실행
|
||||
|
||||
```bash
|
||||
# 1. 의존성 설치
|
||||
npm install
|
||||
|
||||
# 2. 환경변수 설정
|
||||
cp server/.env.example server/.env
|
||||
|
||||
# 3. 개발 서버 실행 (클라이언트 + 서버 동시)
|
||||
npm run dev
|
||||
```
|
||||
|
||||
브라우저에서 http://localhost:5173 접속
|
||||
|
||||
## 개발 서버 포트
|
||||
|
||||
| 서비스 | 포트 |
|
||||
|--------|------|
|
||||
| 클라이언트 (Vite) | 5173 |
|
||||
| 백엔드 API | 3001 |
|
||||
|
||||
## 키보드 단축키
|
||||
|
||||
| 키 | 동작 |
|
||||
|----|------|
|
||||
| Space | 재생 / 일시정지 |
|
||||
| ← / → | 5초 뒤로 / 앞으로 |
|
||||
| J / L | 10초 뒤로 / 앞으로 |
|
||||
| , / . | 이전 / 다음 프레임 (일시정지 시) |
|
||||
| [ / ] | ±30초 이동 |
|
||||
| 0 ~ 9 | 10% 단위 탐색 |
|
||||
| F | 전체화면 |
|
||||
| M | 음소거 |
|
||||
| + / - | 재생속도 조절 |
|
||||
| Shift+S | 프레임 캡처 |
|
||||
| Shift+M | 메모 추가 |
|
||||
| ? | 단축키 도움말 |
|
||||
|
||||
## 프로젝트 구조
|
||||
|
||||
```
|
||||
abcvideo/
|
||||
├── client/ # React 18 + Video.js 8 프론트엔드
|
||||
├── server/ # Node.js + Express 백엔드
|
||||
├── shared/ # 공유 TypeScript 타입
|
||||
└── storage/ # 런타임 생성 (영상, HLS, 프레임)
|
||||
```
|
||||
|
||||
## 환경변수 (server/.env)
|
||||
|
||||
| 변수 | 기본값 | 설명 |
|
||||
|------|--------|------|
|
||||
| PORT | 3001 | 서버 포트 |
|
||||
| FFMPEG_PATH | ffmpeg | FFmpeg 실행 경로 |
|
||||
| MAX_UPLOAD_SIZE | 21474836480 | 최대 업로드 크기 (20GB) |
|
||||
| HLS_SEGMENT_TIME | 6 | HLS 세그먼트 길이 (초) |
|
||||
Reference in New Issue
Block a user