Files
GhiVideo_v4/docs/history/2026-06-24_1150_라벨정보-클릭팝업.md
T
b23042andClaude Fable 5 d38b842e8d GhiVideo 소스 복제 — v4 작업 시작 기준
기존 GhiVideo 저장소 HEAD의 트래킹 소스 362개 파일을 복제.
(node_modules·storage·빌드 산출물·대용량 미디어는 .gitignore 규칙대로 제외)

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-09 14:32:51 +09:00

2.0 KiB
Raw Blame History

라벨 클릭 → 속성 팝업 (라벨 정보 모드)

날짜: 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