@@ -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({
|
||||
isOpen,
|
||||
gisMaps,
|
||||
isSearchModalOpen,
|
||||
treeData = [],
|
||||
isSearch = false,
|
||||
isMiniMap = false,
|
||||
setIsOpen,
|
||||
setFeatureData,
|
||||
featureData,
|
||||
searchView: SearchView,
|
||||
detailView: DetailView,
|
||||
onFeatureSelect,
|
||||
setIsSearchModalOpen,
|
||||
onCheckedLayersChange
|
||||
}) {
|
||||
function Gis({ isOpen, gisMaps, isSearchModalOpen, treeData = [], isSearch = false, isMiniMap = false, setIsOpen, setFeatureData, featureData, searchView: SearchView, detailView: DetailView, onFeatureSelect, setIsSearchModalOpen }) {
|
||||
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
|
||||
visible={tabVisible}
|
||||
setVisible={setTabVisible}
|
||||
onCheckedChange={handleCheckedLayersChange}
|
||||
/>
|
||||
<GisTree visible={tabVisible} setVisible={setTabVisible} />
|
||||
|
||||
{/* <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}
|
||||
onOpenChange={setIsSearchModalOpen}
|
||||
onFeatureSelect={handleFeatureSelect}
|
||||
onFeatureSelect={onFeatureSelect}
|
||||
/>
|
||||
)}
|
||||
<GisLonLat />
|
||||
<GisToolBar />
|
||||
<GisMapToggle />
|
||||
<GisSelect onFeatureSelect={handleFeatureSelect} />
|
||||
<GisSelect onFeatureSelect={onFeatureSelect} />
|
||||
</div>
|
||||
|
||||
{isSearch && (
|
||||
|
||||
@@ -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];
|
||||
@@ -572,13 +573,9 @@ GisApp.core.prototype = {
|
||||
const queryFlter = layerCode?.flterSql || '' + ' ' + (addQurryFlter || '');
|
||||
layerCode['flterSql'] = queryFlter;
|
||||
//layer = this.addWmsLayer(layerCode);
|
||||
|
||||
// WFS 레이어 생성 및 지도에 추가
|
||||
layer = this.addWfsLayer(layerCode);
|
||||
}
|
||||
}
|
||||
|
||||
// 선택 인터랙션 및 스냅 기능 설정
|
||||
if (GisApp.Module.select) {
|
||||
this.setSelectInteraction();
|
||||
}
|
||||
|
||||
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user