gis 원복

packages/common/business_components/src/ui/map/Gis.js

@@ -1,6 +1,5 @@
 import { Search } from 'lucide-react';
 import OlMap from 'ol/Map';
-import Overlay from 'ol/Overlay';
 import View from 'ol/View';
 import { defaults as defaultControls, OverviewMap } from 'ol/control';
 import { defaults } from 'ol/interaction';
@@ -19,22 +18,7 @@ import GisApp from './lib/gis.core';
 export const GisContext = createContext({ gisCore: null, gisMap: null, treeData: null, checkedLayerIds: null });
 export const useGisContext = () => useContext(GisContext);
 
-function Gis({
+function Gis({ isOpen, gisMaps, isSearchModalOpen, treeData = [], isSearch = false, isMiniMap = false, setIsOpen, setFeatureData, featureData, searchView: SearchView, detailView: DetailView, onFeatureSelect, setIsSearchModalOpen }) {
-	isOpen,
-	gisMaps,
-	isSearchModalOpen,
-	treeData = [],
-	isSearch = false,
-	isMiniMap = false,
-	setIsOpen,
-	setFeatureData,
-	featureData,
-	searchView: SearchView,
-	detailView: DetailView,
-	onFeatureSelect,
-	setIsSearchModalOpen,
-	onCheckedLayersChange
-}) {
 	const mapRef = useRef();
 	const [mapObject, setMapObject] = useState({});
 	const [tabVisible, setTabVisible] = useState(true);
@@ -44,17 +28,13 @@ function Gis({
 	const gisCore = useMemo(() => new GisApp.core({ targetId: mapRef.current }), []);
 	const mapInstanceRef = useRef(null);
 	const checkedLayerIds = useRef([]);
-	// 체크된 레이어 상태 관리
-	const [checkedLayers, setCheckedLayers] = useState([]);
-	const [checkedLayersData, setCheckedLayersData] = useState([]);
-
 	let gisMap = null;
 	const closePopup = () => {
 		setIsOpen(false); // 팝업 닫기
 		setFeatureData(null)
 	};
 
-	// Feature Click Event
+	// SearchModal, GisContent 등에서 호출
 	const handleFeatureSelect = useCallback((data) => {
 		gisMap = mapInstanceRef.current;
 
@@ -109,10 +89,8 @@ function Gis({
 		setFeatureData(data);
 		setIsOpen(true);
 		setIsSearchModalOpen(false);
-		onFeatureSelect?.(data); // 선택된 피쳐 데이터 콜백 호출
 	}, [mapInstanceRef]);
 
-	// 지도 생성 및 초기화
 	useEffect(() => {
 		if (!mapRef.current) return;
 		if (mapInstanceRef.current) return; // 이미 생성된 맵이 있다면 중단
@@ -126,7 +104,7 @@ function Gis({
 		]);
 		register(proj4);
 
-		// OpenLayers 지도 객체 생성
+		//맵 생성
 		const map = new OlMap({
 			layers: [gisCore.baseLayers['base'], gisCore.baseLayers['satellite']],
 			renderer: 'webgl',
@@ -154,7 +132,7 @@ function Gis({
 
 		gisMaps.current = map
 
-		// 미니맵 추가
+		//미니맵
 		if (isMiniMap) {
 			const overviewMap = new OverviewMap({
 				layers: [GisApp.Module.core.baseMiniMapLayers['base']],
@@ -169,7 +147,6 @@ function Gis({
 			map.addControl(overviewMap);
 		}
 
-		// 스케일 컨트롤 및 베이스 레이어 설정
 		gisCore.__proto__.map = map;
 		gisCore.scaleControl();
 		gisCore.changeBaseLayer('base');
@@ -177,20 +154,16 @@ function Gis({
 		mapInstanceRef.current = map; // 생성 완료 플래그 설정
 	}, []);
 
-	// treeData 변경 시 레이어 코드 생성
 	useEffect(() => {
 		if (!treeData || treeData.length === 0) return;
 
-		// 기존 오버레이 및 레이어 모두 삭제
 		gisCore.deleteAllOverlay();
 		gisCore.deleteAllLayer();
 
-		// 트리 데이터를 레이어 코드 객체로 변환
 		const layerCode = gisCore.convertLayerInfosToLayerCode(treeData, 'lyrSn');
-		GisApp.layerCode = layerCode; // 전역 레이어 코드 설정
+		GisApp.layerCode = layerCode;
 
 		//setTreeData(data);
-		// 편집 가능한 레이어 목록 생성
 		const layerItems = getLayerItems(layerCode);
 		//setEditLayerItems(prev => [...layerItems])
 	}, [treeData]);
@@ -220,45 +193,31 @@ function Gis({
 		}
 	}
 
-	// 체크된 레이어 정보를 처리하는 함수
-	const handleCheckedLayersChange = useCallback((checkedIds, checkedNodesData) => {
-		setCheckedLayers(checkedIds);
-		setCheckedLayersData(checkedNodesData);
-		onCheckedLayersChange?.(checkedIds, checkedNodesData);
-	}, [onCheckedLayersChange]);
-
 	return (
 		<>
 			<GisContext.Provider value={{ gisCore, gisMap: mapInstanceRef.current, treeData, checkedLayerIds }}>
 				<div className="h-[calc(100vh-10rem)] flex relative">
 					<div ref={mapRef} className="gis-map flex-1 relative" style={{ height: '100%', padding: 0 }} />
-					<GisTree
+					<GisTree visible={tabVisible} setVisible={setTabVisible} />
-						visible={tabVisible}
-						setVisible={setTabVisible}
-						onCheckedChange={handleCheckedLayersChange}
-					/>
 
 					{/* <GisContent onFeatureSelect={handleFeatureSelect} isSearch={isSearch} isSearchModalOpen={isSearchModalOpen} setIsSearchModalOpen={setIsSearchModalOpen} /> */}
 
-					{/* DetailView가 존재할 때만 렌더링 isSearchModalOpen이 true면 visible=false로 팝업 숨김 */}
+					{/* isSearchModalOpen이 true면 visible=false로 팝업 숨김 */}
 					{isOpen && featureData && !isSearchModalOpen && (
 						<DetailView
 							featureData={featureData}
 							onClose={closePopup} // 닫기 콜백 전달
 						/>
 					)}
-					{/* SearchView가 존재할 때만 렌더링 */}
+					<SearchView
-                {SearchView && (
+						open={isSearchModalOpen}
-                    <SearchView
+						onOpenChange={setIsSearchModalOpen}
-                        open={isSearchModalOpen}
+						onFeatureSelect={onFeatureSelect}
-                        onOpenChange={setIsSearchModalOpen}
+					/>
-                        onFeatureSelect={handleFeatureSelect}
-                    />
-                )}
 					<GisLonLat />
 					<GisToolBar />
 					<GisMapToggle />
-					<GisSelect onFeatureSelect={handleFeatureSelect} />
+					<GisSelect onFeatureSelect={onFeatureSelect} />
 				</div>
 
 				{isSearch && (

packages/common/business_components/src/ui/map/lib/gis.core.js

@@ -1,24 +1,26 @@
 import MousePosition from 'ol/control/MousePosition';
 import ScaleLine from 'ol/control/ScaleLine';
-import { getTopLeft } from 'ol/extent';
 import Feature from 'ol/Feature';
-import GeoSJON from 'ol/format/GeoJSON';
 import WKT from 'ol/format/WKT';
-import { Point } from 'ol/geom';
 import LinearRing from 'ol/geom/LinearRing';
 import Draw from 'ol/interaction/Draw';
 import TileLayer from 'ol/layer/Tile';
-import VectorLayer from 'ol/layer/Vector';
 import * as olProj from 'ol/proj';
 import VectorSource from 'ol/source/Vector';
-import TileWMTS from 'ol/source/WMTS';
 import XYZ from 'ol/source/XYZ';
+import GeoSJON from 'ol/format/GeoJSON';
 import { Fill, Stroke, Style } from 'ol/style';
 import CircleStyle from 'ol/style/Circle';
+import VectorLayer from 'ol/layer/Vector';
+import { Point } from 'ol/geom';
+import { getTopLeft } from 'ol/extent';
+import TileWMTS from 'ol/source/WMTS';
 import WMTSTileGrid from 'ol/tilegrid/WMTS';
 // import { get as getProjection } from 'ol/proj';
-import { register } from 'ol/proj/proj4';
 import proj4 from 'proj4';
+import { register } from 'ol/proj/proj4';
+import olSourceImageWMS from 'ol/source/ImageWMS';
+import { GeoJSON } from 'ol/format';
 import GisOlEditLayer from './gis.edit';
 import GisOlLayer from './gis.layer';
 
@@ -560,7 +562,6 @@ GisApp.core.prototype = {
 	 *
 	 * Returns:
 	 */
-	// 레이어를 지도에 표시/숨김
 	setLayerOnMap: function (layerIds, visible, addQurryFlter) {
 		for (let i in layerIds) {
 			let id = layerIds[i];
@@ -571,14 +572,10 @@ GisApp.core.prototype = {
 				const layerCode = GisApp.layerCode[id];
 				const queryFlter = layerCode?.flterSql || '' + ' ' + (addQurryFlter || '');
 				layerCode['flterSql'] = queryFlter;
-				//layer = this.addWmsLayer(layerCode);
+				//layer = this.addWmsLayer(layerCode);				
-
-				// WFS 레이어 생성 및 지도에 추가
 				layer = this.addWfsLayer(layerCode);
 			}
 		}
-
-		// 선택 인터랙션 및 스냅 기능 설정
 		if (GisApp.Module.select) {
 			this.setSelectInteraction();
 		}

packages/common/business_components/src/ui/map/lib/gis.layer.js

@@ -77,7 +77,15 @@ GisOlLayer.prototype = {
 		let lyrTyNm = options.lyrTyNm;
 		let typename = this.storageNm + lyrTyNm;
 		
-		if(options.lyrTyNm == "om_dt_untrt_swg_rain"){ //중점우수토실실
+		if(options.lyrTyNm == "om_dt_untrt_swg_rain" //중점우수토실
+			|| options.lyrTyNm == "om_wqlt_station"  //관측소
+			|| options.lyrTyNm == "tb_wr_bdst_ruse_fclt"  //재이용시설
+			|| options.lyrTyNm == "tb_wr_rnwtr_utztn_fclt"  //빗물이용시설
+			|| options.lyrTyNm == "tb_wr_rswtr_fclt"  //중수도시설
+			|| options.lyrTyNm == "tb_wr_htdfl_fclt"  //온배수시설
+			|| options.lyrTyNm == "tb_wr_tmpr_dmd_co"  //잠재수요처
+		) 
+		{ 
 			url = GisApp.SN_GEOSERVER_URL;
 			typename = lyrTyNm;
 		}