htlee
4c7bd42b42
- Session E: 관심구역 폴리곤 + 추적 반경원 MapLibre GeoJSON 레이어로 전환 - useRealmLayer: OL VectorLayer → MapLibre fill/line layer - useTrackingMode: 반경 원 @turf/circle → GeoJSON source - Session F: 측정 도구 MapLibre 커스텀 구현 - useMeasure: OL Draw/Overlay → MapLibre Marker + GeoJSON layer - 거리/면적: @turf/distance, @turf/length, @turf/area - 툴 믹싱 지원, 세션 persistence - Session H: 미니맵 MapLibre 전환 + OpenLayers 완전 제거 - VesselDetailModal/StsContactDetailModal: OL 임베디드 맵 → MapLibre 7개 레이어 - mapStore: map 타입 any → maplibregl.Map | null - csvDownload: OL Polygon → Turf.js booleanPointInPolygon - package.json: ol, ol-ext 제거 (~500KB 감소) - main.tsx: OL CSS 제거 - 6개 OL 파일 @ts-nocheck 추가 (Session G 패스) 검증: yarn type-check, yarn lint, yarn build 통과 Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
44 lines
1.0 KiB
SCSS
44 lines
1.0 KiB
SCSS
/* 측정 툴팁 스타일 */
|
|
|
|
/* MapLibre Marker wrapper(.maplibregl-marker)가 width 미지정이므로
|
|
자식 element에 display: inline-block + width: max-content로 크기 제한 */
|
|
.measure-tooltip {
|
|
display: inline-block;
|
|
width: max-content;
|
|
padding: 0.4rem 0.8rem;
|
|
border-radius: 0.4rem;
|
|
font-size: 1.2rem;
|
|
white-space: nowrap;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.measure-tooltip-active {
|
|
background: rgba(255, 237, 169, 0.85);
|
|
color: #333;
|
|
font-weight: 600;
|
|
border: 0.1rem solid rgba(200, 180, 100, 0.5);
|
|
}
|
|
|
|
.measure-tooltip-static {
|
|
background: rgba(255, 237, 169, 0.85);
|
|
color: #333;
|
|
font-weight: 600;
|
|
border: 0.1rem solid rgba(200, 180, 100, 0.5);
|
|
}
|
|
|
|
.measure-tooltip-segment {
|
|
background: rgba(255, 255, 255, 0.8);
|
|
color: #555;
|
|
font-size: 1.1rem;
|
|
font-weight: 500;
|
|
border: 0.1rem solid rgba(180, 180, 180, 0.6);
|
|
}
|
|
|
|
.measure-tooltip-segment-static {
|
|
background: rgba(255, 255, 255, 0.75);
|
|
color: #666;
|
|
font-size: 1.1rem;
|
|
font-weight: 500;
|
|
border: 0.1rem solid rgba(180, 180, 180, 0.5);
|
|
}
|