HeungTak Lee
f4f0cb274f
- Vite 마이그레이션, OpenLayers+Deck.gl 지도 연동 - STOMP WebSocket 선박 실시간 데이터 수신 - 선박 범례/필터/카운트, 다크시그널 처리 - Ctrl+Drag 박스선택, 우클릭 컨텍스트 메뉴 - 측정도구, 상세모달, 호버 툴팁 - darkSignalIds Set 패턴, INSHORE/OFFSHORE 타임아웃 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
62 lines
1.5 KiB
JavaScript
62 lines
1.5 KiB
JavaScript
import { create } from 'zustand';
|
|
|
|
/**
|
|
* 지도 상태 관리 스토어
|
|
*/
|
|
export const useMapStore = create((set, get) => ({
|
|
// 지도 인스턴스
|
|
map: null,
|
|
setMap: (map) => set({ map }),
|
|
|
|
// 줌 레벨
|
|
zoom: 7,
|
|
setZoom: (zoom) => set({ zoom }),
|
|
|
|
zoomIn: () => {
|
|
const { map, zoom } = get();
|
|
if (map && zoom < 17) {
|
|
const newZoom = zoom + 1;
|
|
map.getView().setZoom(newZoom);
|
|
set({ zoom: newZoom });
|
|
}
|
|
},
|
|
|
|
zoomOut: () => {
|
|
const { map, zoom } = get();
|
|
if (map && zoom > 0) {
|
|
const newZoom = zoom - 1;
|
|
map.getView().setZoom(newZoom);
|
|
set({ zoom: newZoom });
|
|
}
|
|
},
|
|
|
|
// 중심 좌표 [lon, lat]
|
|
center: [127.1388684, 37.4449168],
|
|
setCenter: (center) => set({ center }),
|
|
|
|
// 측정 도구
|
|
activeMeasureTool: null, // 'distance' | 'area' | 'rangeRing' | null
|
|
areaShape: null, // 'Polygon' | 'Box' | 'Circle' | null
|
|
|
|
setMeasureTool: (tool) => set((state) => ({
|
|
activeMeasureTool: state.activeMeasureTool === tool ? null : tool,
|
|
areaShape: null,
|
|
})),
|
|
setAreaShape: (shape) => set({ areaShape: shape }),
|
|
clearMeasure: () => set({ activeMeasureTool: null, areaShape: null }),
|
|
|
|
// 레이어 가시성
|
|
layerVisibility: {
|
|
baseMap: true,
|
|
ships: true,
|
|
weather: false,
|
|
satellite: false,
|
|
},
|
|
toggleLayer: (layerName) => set((state) => ({
|
|
layerVisibility: {
|
|
...state.layerVisibility,
|
|
[layerName]: !state.layerVisibility[layerName],
|
|
},
|
|
})),
|
|
}));
|