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],
|
||
|
|
},
|
||
|
|
})),
|
||
|
|
}));
|