b23042andClaude Opus 4.8
78fc090360
- 클라이언트(React/Vite): Video.js 플레이어, 하단 스테이션바, POI/구조물 영상 오버레이, 카메라 파라미터 보정, 미니맵/RoutePanel - 서버(Express): Range 스트리밍, HLS 변환, 프레임 추출, tus 업로드, 주석 API - 최근 작업: 스테이션바 종점역 표출/양끝 정렬/미도착(재생불가) 표시, POI 라벨 '구분' 우선·컴팩트 팝업·겹침제외 토글·동일좌표 다중행, 진행방향(상/하) 우선 표출, 커서 배지 크기·픽셀 떨림 개선 Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
41 lines
2.0 KiB
Markdown
41 lines
2.0 KiB
Markdown
# 라벨 클릭 → 속성 팝업 (라벨 정보 모드)
|
||
|
||
**날짜**: 2026-06-24
|
||
**수정 파일**: `client/src/components/overlay/StationOverlay.tsx`
|
||
|
||
## 요구
|
||
영상의 라벨을 클릭하면 속성 팝업이 열리게.
|
||
|
||
## 구현 — "ℹ️ 라벨 정보" 모드
|
||
편집/세로화각 보정과 상호 배타인 토글 모드. 켜면 캔버스가 클릭을 받고, 라벨을 누르면 속성 팝업 표시.
|
||
|
||
- 상태 `infoMode`(+ref) + `infoPopup`(클릭한 라벨 속성·화면좌표). 모드 끄면 팝업 자동 닫힘.
|
||
- `onPoiPointerDown` 에 info 분기: 클릭점을 영상정규좌표로 변환(`clientToVideoNorm`) 후
|
||
표시 중인 POI(`displayedPoiRef`)·측점(`displayedStRef`) 중 최근접(반경 ~0.04) 히트테스트.
|
||
- 데이터 조회: POI=`allPoisRef`+`allStructuresRef`, 측점=`allGeoStationsRef`.
|
||
- 표고 z = override(DEM/드래그) → 없으면 최근접 측점표고(`nearestCL`) → obj.z.
|
||
- 드론 수평거리 = `toCameraCoords(...).distH`.
|
||
- 빈 곳 클릭 시 팝업 닫힘.
|
||
- 캔버스 `pointer-events`/커서: editMode·fovMode(이동) 또는 **infoMode(pointer)** 일 때 활성.
|
||
- 팝업 UI: 제목(이모지)·종류·카테고리·위도·경도·표고(보정 표시)·드론 거리. ✕로 닫기.
|
||
위치는 클릭한 라벨 화면좌표 옆(화면 밖으로 안 나가게 클램프).
|
||
|
||
## 표시 속성
|
||
| 항목 | 내용 |
|
||
|---|---|
|
||
| 제목 | cleanTitle (괄호 상/하 제거) |
|
||
| 종류·카테고리 | POI/측점 · 교량/터널/구교/지장물/측점 등 |
|
||
| 위도·경도 | 6자리 |
|
||
| 표고 | groundZ(m), override면 "(보정)" |
|
||
| 거리 | 드론 기준 수평거리(distH, m) |
|
||
|
||
## 참고
|
||
- 라벨이 보일 때(측점선 표시 ON)만 클릭 가능(숨김 상태면 히트 대상 없음).
|
||
- 팝업은 클릭 시점 위치에 고정(재생 중 라벨은 움직여도 팝업은 정보창으로 유지).
|
||
|
||
## 검증
|
||
- `npm run build -w client` (node20) tsc + vite build 통과.
|
||
|
||
**소요 시간**: 약 14분
|
||
**Context 사용량**: input ~410k / output ~7k tokens
|