diff --git a/src/main/webapp/com/img/map-service/geology/index/ga01.gif b/src/main/webapp/com/img/map-service/geology/index/ga01.gif new file mode 100644 index 00000000..4dc8a2f1 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga01.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga02.gif b/src/main/webapp/com/img/map-service/geology/index/ga02.gif new file mode 100644 index 00000000..b18999ad Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga02.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga03.gif b/src/main/webapp/com/img/map-service/geology/index/ga03.gif new file mode 100644 index 00000000..6d4d15d9 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga03.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga04.gif b/src/main/webapp/com/img/map-service/geology/index/ga04.gif new file mode 100644 index 00000000..d5ec6220 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga04.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga05.gif b/src/main/webapp/com/img/map-service/geology/index/ga05.gif new file mode 100644 index 00000000..7c388996 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga05.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga06.gif b/src/main/webapp/com/img/map-service/geology/index/ga06.gif new file mode 100644 index 00000000..04d5d40f Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga06.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga07.gif b/src/main/webapp/com/img/map-service/geology/index/ga07.gif new file mode 100644 index 00000000..28aa96d6 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga07.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga08.gif b/src/main/webapp/com/img/map-service/geology/index/ga08.gif new file mode 100644 index 00000000..17be9eda Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga08.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga09.gif b/src/main/webapp/com/img/map-service/geology/index/ga09.gif new file mode 100644 index 00000000..27a8dcef Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga09.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga10.gif b/src/main/webapp/com/img/map-service/geology/index/ga10.gif new file mode 100644 index 00000000..6d9be663 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga10.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga11.gif b/src/main/webapp/com/img/map-service/geology/index/ga11.gif new file mode 100644 index 00000000..6d9be663 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga11.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga12.gif b/src/main/webapp/com/img/map-service/geology/index/ga12.gif new file mode 100644 index 00000000..fc1d718f Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga12.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga13.gif b/src/main/webapp/com/img/map-service/geology/index/ga13.gif new file mode 100644 index 00000000..27f272da Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga13.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga14.gif b/src/main/webapp/com/img/map-service/geology/index/ga14.gif new file mode 100644 index 00000000..0e27e781 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga14.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga15.gif b/src/main/webapp/com/img/map-service/geology/index/ga15.gif new file mode 100644 index 00000000..3aa674b7 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga15.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga16.gif b/src/main/webapp/com/img/map-service/geology/index/ga16.gif new file mode 100644 index 00000000..42fa75de Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga16.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga17.gif b/src/main/webapp/com/img/map-service/geology/index/ga17.gif new file mode 100644 index 00000000..80d014cd Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga17.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga18.gif b/src/main/webapp/com/img/map-service/geology/index/ga18.gif new file mode 100644 index 00000000..c7c4477d Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga18.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga19.gif b/src/main/webapp/com/img/map-service/geology/index/ga19.gif new file mode 100644 index 00000000..412e1dbb Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga19.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/ga20.gif b/src/main/webapp/com/img/map-service/geology/index/ga20.gif new file mode 100644 index 00000000..60ccd754 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/ga20.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/txt_c.gif b/src/main/webapp/com/img/map-service/geology/index/txt_c.gif new file mode 100644 index 00000000..71d542e3 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/txt_c.gif differ diff --git a/src/main/webapp/com/img/map-service/geology/index/txt_pc.gif b/src/main/webapp/com/img/map-service/geology/index/txt_pc.gif new file mode 100644 index 00000000..6e26d2f3 Binary files /dev/null and b/src/main/webapp/com/img/map-service/geology/index/txt_pc.gif differ diff --git a/src/main/webapp/js/map/main/map.js b/src/main/webapp/js/map/main/map.js index 476e1d4a..043004aa 100644 --- a/src/main/webapp/js/map/main/map.js +++ b/src/main/webapp/js/map/main/map.js @@ -435,6 +435,224 @@ var geologyLayers = { }; var geologyLayersKey = null; // 지질 광산 layer명 +var geologyLegendPopup = null; // 지질도 범례 팝업 객체를 저장할 변수 + +//사용자가 제공한 범례 HTML (템플릿 리터럴로 저장) +//Iframe에 맞도록 bodyClass의 width를 760px에서 98%로 수정 +var GEOLOGY_LEGEND_HTML = ` + + + + + 암상시대별 색상 + + + +
+
+

암상시대별 색상

+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
코드번호시대명시대기호기본색
GA01제4기(Quaternary)충적층
(Alluvium)		Qa 제4기 충적층 RGB 기본색
GA02홍적층
(Diluvium)		Qd 제4기 홍적층 RGB 기본색
GA03신제3기
(Neogene)
N2신제3기 RGB 기본색
GA04고제3기
(Paleogene)		PG고제3기 RGB 기본색
GA05백악기
(Cretaceous)
K 백악기 RGB 기본색
GA06쥬라기
(Jurassic)		J쥬라기 RGB 기본색
GA07삼첩기
(Triassic)		T 삼첩기 RGB 기본색
GA08페름기
(Permian)		P폐름기 RGB 기본색
GA09석탄기
(Carboniferous)		C석탄기 RGB 기본색
GA10데본기
(Devonian)		D데본기 RGB 기본색
GA11사일루리아기
(Silurian)		S사일루리아기 RGB 기본색
GA12오도비스기
(Ordovician)		O오도비스기 RGB 기본색
GA13캠브리아기
(Cambrian)		C캠브리아기 RGB 기본색
GA14원생대
(Proterozoic)		PRgrPR,
PC		원생대 PRgr RGB 기본색
GA15PR3원생대 PR3 RGB 기본색
GA16PR2원생대 PR2 RGB 기본색
GA17PR1원생대 PR1 RGB 기본색
GA18시생대
(Archean)		AR3AR,
PC		시생대 AR3 RGB 기본색
GA19AR2시생대 AR2 RGB 기본색
GA20AR1시생대 AR1 RGB 기본색
+
+
+
+ + +`; + + + + function initApp(param){ // --------------------- // 지도 생성 @@ -5066,8 +5284,113 @@ function showSichuInfo2(){ } +/** + * 지질도 범례 팝업이 열려있으면 닫습니다. + */ +function removeGeologyLegend() { + // 팝업 드래그 이벤트를 해제합니다. + $(document).off('mousemove.legendPopup').off('mouseup.legendPopup'); + + // 팝업 DOM을 제거합니다. + if (geologyLegendPopup) { + geologyLegendPopup.remove(); + geologyLegendPopup = null; + } +} +/** + * WMS 지질도 범례를 드래그 가능한 모달로 띄웁니다. + * (Iframe을 사용하여 외부 CSS/HTML 충돌을 방지합니다) + */ +function showGeologyLegend() { + // 1. 기존 팝업이 있다면 제거합니다. + removeGeologyLegend(); + + // 2. 모달의 기본 HTML 구조를 정의합니다. + var popupHtml = + ''; + + // 3. HTML을 body에 추가하고 jQuery 객체 참조를 저장합니다. + $('body').append(popupHtml); + geologyLegendPopup = $('#geologyLegendPopup'); // 전역 변수에 할당 + var iframeContainer = $('#legendIframeContainer'); + + // 4. Iframe을 생성하고 설정합니다. + var iframe = document.createElement('iframe'); + iframe.style.width = '100%'; + iframe.style.height = '500px'; // 모달 내용물의 높이 + iframe.style.border = 'none'; + iframe.setAttribute('frameborder', '0'); // 구형 브라우저 호환 + + // 5. Iframe을 모달 컨테이너에 추가합니다. + iframeContainer.append(iframe); + + // 6. Iframe 내부에 범례 HTML을 동적으로 씁니다. + // (CSS/HTML 격리를 위해 이 방식이 가장 안전합니다) + try { + var doc = iframe.contentWindow || iframe.contentDocument; + if (doc.document) doc = doc.document; + + doc.open(); + doc.write(GEOLOGY_LEGEND_HTML); // 위에서 정의한 HTML 변수 사용 + doc.close(); + } catch (e) { + console.error("범례 Iframe에 내용을 쓰는 데 실패했습니다:", e); + } + + // 7. 모달의 초기 위치를 화면 중앙으로 설정합니다. + var popupWidth = geologyLegendPopup.outerWidth(); + var popupHeight = geologyLegendPopup.outerHeight(); + var initialTop = Math.max(20, ($(window).height() - popupHeight) / 2); + var initialLeft = Math.max(20, ($(window).width() - popupWidth) / 2); + + geologyLegendPopup.css({ + top: initialTop + 'px', + left: initialLeft + 'px', + visibility: 'visible' // 이제 보이도록 설정 + }); + + // 8. 드래그 이벤트를 구현합니다. (geologyMine 함수와 동일한 로직) + var isDragging = false; + var offset = { x: 0, y: 0 }; + var header = geologyLegendPopup.find('.popup-header'); + + header.on('mousedown', function(e) { + isDragging = true; + var popupPos = geologyLegendPopup.offset(); + offset.x = e.pageX - popupPos.left; + offset.y = e.pageY - popupPos.top; + e.preventDefault(); + }); + + // 이벤트 이름에 .legendPopup 네임스페이스를 지정하여 다른 드래그와 충돌 방지 + $(document).on('mousemove.legendPopup', function(e) { + if (isDragging) { + geologyLegendPopup.offset({ + top: e.pageY - offset.y, + left: e.pageX - offset.x + }); + } + }); + + $(document).on('mouseup.legendPopup', function() { + isDragging = false; + }); + + // 9. 닫기 버튼 이벤트를 설정합니다. + $('#closeLegendPopupBtn').on('click', function() { + removeGeologyLegend(); + }); +} + -//기존 geologyMode 함수를 지우고 아래의 코드로 교체하세요. function geologyMode() { initControl(); // 다른 컨트롤 상태 초기화 @@ -5086,15 +5409,17 @@ function geologyMode() { GEOLOGY_LAYER.setVisibility(false); CTL_INFO.setText("지질 Off"); CTL_INFO.deactivate(); // 정보창도 비활성화 + + removeGeologyLegend(); // 지질도를 끌 때 범례도 닫습니다. + } else { // 레이어가 현재 숨겨져 있다면, // 1. 표시할 기본 지질도 키를 설정합니다. - geologyLayersKey = "지질도_25만_지질도"; + geologyLayersKey = "지질도_25만_지질도"; var wmsLayerName = geologyLayers[geologyLayersKey]; if (wmsLayerName) { // 2. 정규표현식을 사용하여 URL에서 'LAYERS=' 파라미터의 값만 교체합니다. - // (광산 뷰에서 다른 레이어로 변경되었을 수 있으므로 항상 기본값으로 재설정) var newUrl = GEOLOGY_LAYER.url.replace(/(LAYERS=)([^&]*)/, '$1' + wmsLayerName); // 3. 레이어 객체의 url 속성을 직접 변경합니다. @@ -5104,18 +5429,32 @@ function geologyMode() { GEOLOGY_LAYER.setVisibility(true); GEOLOGY_LAYER.redraw(true); - // 5. 정보창 텍스트를 업데이트합니다. + // 5. 정보창 텍스트 및 버튼을 업데이트합니다. + + // '범례 보기' 버튼 HTML 정의 (이전 단계에서 수정한 내용) + var legendButtonHtml = '
' + + '범례 보기
'; + + // CTL_INFO의 infoDiv가 내부 요소를 absolute 포지셔닝할 수 있도록 'relative'로 설정 + $(CTL_INFO.infoDiv).css("position", "relative"); + + // CTL_INFO 텍스트 설정 시 버튼 HTML을 함께 삽입 + //CTL_INFO.setText("지질 On" + legendButtonHtml); CTL_INFO.setText("지질 On"); CTL_INFO.activate(); + showGeologyLegend(); $("#CTL_INFO").css("bottom", "65px"); $("#CTL_INFO").css("left", "20px"); + } else { console.error("기본 지질도 레이어를 찾을 수 없습니다:", geologyLayersKey); } } } - function geologyMine() { initControl(); // 다른 컨트롤 상태 초기화