From 614e8fa41ee4b9fba01d5054ab88eb7988b769c0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=EA=B0=95=EC=84=9D=20=EC=B5=9C?= Date: Wed, 2 Mar 2022 17:41:35 +0900 Subject: [PATCH] =?UTF-8?q?=ED=98=84=EC=9E=A5=EC=88=98=EC=A7=91=EB=8D=B0?= =?UTF-8?q?=EC=9D=B4=ED=84=B0=20>=20=EC=83=81=EC=84=B8=20=ED=8E=98?= =?UTF-8?q?=EC=9D=B4=EC=A7=80=20=EC=A7=80=EB=8F=84=20=EC=98=A4=EB=A5=98=20?= =?UTF-8?q?=EC=88=98=EC=A0=95.?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../webapp/WEB-INF/jsp/admin/dashBoard.jsp | 2 +- .../webapp/WEB-INF/jsp/admin/fieldView.jsp | 418 +++++------------- .../WEB-INF/jsp/layout/template_login.jsp | 4 +- .../WEB-INF/jsp/layout/template_main.jsp | 4 +- src/main/webapp/WEB-INF/tiles/tiles.xml | 9 +- src/main/webapp/css/style.css | 10 +- src/main/webapp/js/admin/fieldView.js | 293 ++++++------ 7 files changed, 271 insertions(+), 469 deletions(-) diff --git a/src/main/webapp/WEB-INF/jsp/admin/dashBoard.jsp b/src/main/webapp/WEB-INF/jsp/admin/dashBoard.jsp index 1abc434..5418297 100644 --- a/src/main/webapp/WEB-INF/jsp/admin/dashBoard.jsp +++ b/src/main/webapp/WEB-INF/jsp/admin/dashBoard.jsp @@ -4,7 +4,7 @@ <%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%> <%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%> - +<%----%>
diff --git a/src/main/webapp/WEB-INF/jsp/admin/fieldView.jsp b/src/main/webapp/WEB-INF/jsp/admin/fieldView.jsp index e8cecec..dc6e35b 100644 --- a/src/main/webapp/WEB-INF/jsp/admin/fieldView.jsp +++ b/src/main/webapp/WEB-INF/jsp/admin/fieldView.jsp @@ -3,320 +3,116 @@ <%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%> <%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%> <%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%> - - + " rel="stylesheet"> " rel="stylesheet"> - + + + - -
- -
- -
- - - - - - - - - - - - - - - - - -
담당자
소속담당자연락처
- - - - - - - - - - - - - - - - - - - - - - - - - - - -
지도정보
레이어 ID수집일
지역상태 - - - 수집 - - - 검증실패 - - - 검증성공 - - - 반영실패 - - - 반영 - - -
설명오류내용
- -
- -
-
측량데이터
- -
-
- - -
- - - - - - - - - -
속성정보
-
- -
    + - -
    - - -
    -

    - -

    -

    - - -

    -
    -
    \ No newline at end of file +
    + +
    + +
    + + + + + + + + + + + + + + + + +
    담당자
    소속담당자연락처
    + + + + + + + + + + + + + + + + + + + + + + + + + + + +
    지도정보
    레이어 ID수집일
    지역상태 + + + 수집 + + + 검증실패 + + + 검증성공 + + + 반영실패 + + + 반영 + + +
    설명오류내용
    + +
    +
    +
    측량데이터
    + +
    +
    +
    + + + + + + + + + +
    속성정보
    +
    +
      +
      + + +
      +

      + +

      +

      + + +

      +
      +
      \ No newline at end of file diff --git a/src/main/webapp/WEB-INF/jsp/layout/template_login.jsp b/src/main/webapp/WEB-INF/jsp/layout/template_login.jsp index 82ac639..56f40a3 100644 --- a/src/main/webapp/WEB-INF/jsp/layout/template_login.jsp +++ b/src/main/webapp/WEB-INF/jsp/layout/template_login.jsp @@ -20,8 +20,6 @@ #wrap{ background-image: url("/images/main1.jpg"); background-size: cover; - margin: 0; - padding: 0; height: 1080px; } @@ -32,7 +30,7 @@ - +
      diff --git a/src/main/webapp/WEB-INF/jsp/layout/template_main.jsp b/src/main/webapp/WEB-INF/jsp/layout/template_main.jsp index f7a9899..cd4f225 100644 --- a/src/main/webapp/WEB-INF/jsp/layout/template_main.jsp +++ b/src/main/webapp/WEB-INF/jsp/layout/template_main.jsp @@ -23,11 +23,11 @@ - +
      -
      +
      diff --git a/src/main/webapp/WEB-INF/tiles/tiles.xml b/src/main/webapp/WEB-INF/tiles/tiles.xml index 6ba01c7..1ffa934 100644 --- a/src/main/webapp/WEB-INF/tiles/tiles.xml +++ b/src/main/webapp/WEB-INF/tiles/tiles.xml @@ -27,7 +27,10 @@ - - - + + + + + + \ No newline at end of file diff --git a/src/main/webapp/css/style.css b/src/main/webapp/css/style.css index 109cc2a..f047765 100644 --- a/src/main/webapp/css/style.css +++ b/src/main/webapp/css/style.css @@ -67,16 +67,12 @@ a { color: #fff; font-size: 17px; } - +.htmlBody{ + background-color: rgb(247, 247, 247); +} .section { margin-top: 70px; margin-left: 200px; - min-width: 1160px; - min-height: 100px; - overflow: hidden; - padding-top: 20px; - height: 100vh; - background-color: rgb(247, 247, 247); } .loginWrap { diff --git a/src/main/webapp/js/admin/fieldView.js b/src/main/webapp/js/admin/fieldView.js index e6ebf7f..62bab20 100644 --- a/src/main/webapp/js/admin/fieldView.js +++ b/src/main/webapp/js/admin/fieldView.js @@ -1,202 +1,211 @@ +let wkt = null; +proj4.defs('EPSG:5186', '+proj=tmerc +lat_0=38 +lon_0=127 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs'); - function fieldVerify(){ - alert('준비중'); -} - - function fieldReflect(){ - alert('준비중'); -} - - $(function() { - drawingObj(); - makePropPaging(); - makePropTable(); -}); - - var field_data = JSON.parse('${fieldDataVO.field_data}'); - var wkt = null; - proj4.defs('EPSG:5186', '+proj=tmerc +lat_0=38 +lon_0=127 +k=1 +x_0=200000 +y_0=600000 +ellps=GRS80 +units=m +no_defs'); - var baseMap = new ol.layer.Tile({ - title : 'vworldMap', - visible : true, - type : 'base', - source : new ol.source.XYZ({ +let baseMap = new ol.layer.Tile({ + title : 'vworldMap', + visible : true, + type : 'base', + source : new ol.source.XYZ({ url : 'http://api.vworld.kr/req/wmts/1.0.0/5616CAD1-5D79-3EE3-87D5-878A4AD0F91F/Base/{z}/{y}/{x}.png' -}) + }) }); - var view = new ol.View({ - center : ol.proj.transform([ 203766.984, 541132.2 ], 'EPSG:5186', 'EPSG:3857'), - zoom : 18, // 초기화면 zoom level - minZoom : 1, // 최소 zoom level - maxZoom : 19, // 최대 zoom level + +let view = new ol.View({ + center : ol.proj.transform([ 203766.984, 541132.2 ], 'EPSG:5186', 'EPSG:3857'), + zoom : 18, // 초기화면 zoom level + minZoom : 1, // 최소 zoom level + maxZoom : 19, // 최대 zoom level }); - var map = new ol.Map({ +let map = new ol.Map({ + layers : [ baseMap ], + logo : false, //우측하단 로고 제거 + target : 'map', + loadTilesWhileAnimating : true, + view : view +}); + +let format = new ol.format.WKT(); +let objVectorSource = new ol.source.Vector({}); +let objVectorLayer = new ol.layer.Vector({ + source : objVectorSource, + style : objStyle +}); + +let cursorStyle = ""; +let selected = null; + +let highlightStyle = new ol.style.Style({ + stroke : new ol.style.Stroke({ + color : '#3399CC', + width : 8, + }), +}); + +$(function() { + makePropPaging(); + makePropTable(); + map = new ol.Map({ layers : [ baseMap ], logo : false, //우측하단 로고 제거 target : 'map', loadTilesWhileAnimating : true, view : view + }); + drawingObj(); }); - var format = new ol.format.WKT(); - var objVectorSource = new ol.source.Vector({}); - var objVectorLayer = new ol.layer.Vector({ - source : objVectorSource, - style : objStyle -}); +function fieldVerify(){ + alert('준비중'); +} - var cursorStyle = ""; - var selected = null; - map.on("pointermove", function(e) { - if (selected !== null) { +function fieldReflect(){ + alert('준비중'); +} + +map.on("pointermove", function(e) { + if (selected !== null) { selected.setStyle(undefined); selected = null; -} - var newStyle = this.hasFeatureAtPixel(e.pixel) ? "pointer" : ""; - newStyle !== cursorStyle && $(this.getTargetElement()).css("cursor", cursorStyle = newStyle); - map.forEachFeatureAtPixel(e.pixel, function(f) { + } + var newStyle = this.hasFeatureAtPixel(e.pixel) ? "pointer" : ""; + newStyle !== cursorStyle && $(this.getTargetElement()).css("cursor", cursorStyle = newStyle); + map.forEachFeatureAtPixel(e.pixel, function(f) { selected = f; f.setStyle(highlightStyle); return true; -}); + }); }); - var highlightStyle = new ol.style.Style({ - stroke : new ol.style.Stroke({ - color : '#3399CC', - width : 8, -}), + +// feature click evt +map.on('click', function(event) { + map.forEachFeatureAtPixel(event.pixel, function(feature, layer) { + var idx = feature.get("idx"); + makePropTable(idx); + }) }); - // feature click evt - map.on('click', function(event) { - map.forEachFeatureAtPixel(event.pixel, function(feature, layer) { - var idx = feature.get("idx"); - makePropTable(idx); - }) -}); - - function objStyle(feature, resolution) { - var selected = feature.get('selected'); - var style = null; - if (selected) { +function objStyle(feature, resolution) { + var selected = feature.get('selected'); + var style = null; + if (selected) { style = new ol.style.Style({ - stroke : new ol.style.Stroke({ - color : '#f00', - width : 5 -}) -}); -} else { + stroke : new ol.style.Stroke({ + color : '#f00', + width : 5 + }) + }); + } else { style = new ol.style.Style({ - stroke : new ol.style.Stroke({ - color : '#52b4e7', - width : 5 -}) -}); -} - return style; + stroke : new ol.style.Stroke({ + color : '#52b4e7', + width : 5 + }) + }); + } + return style; } - function resetObjStyle() { - var feature = getObjFeatureBySelected(); - if (feature) { +function resetObjStyle() { + var feature = getObjFeatureBySelected(); + if (feature) { feature.set("selected", false); -} + } } - function makePropTable(idx) { - if (idx == null) +function makePropTable(idx) { + if (idx == null) idx = 0; - $("#fieldDataBody > tr").remove(); + $("#fieldDataBody > tr").remove(); - var num = 0; - var tags = ""; - for(var i in field_data[idx].prop) { + var num = 0; + var tags = ""; + for(var i in field_data[idx].prop) { num++; if(num % 2 == 0){ - tags += "" + i + "" + field_data[idx].prop[i] + ""; -}else{ - tags += "" + i + "" + field_data[idx].prop[i] + ""; -} -} - $("#fieldDataBody").append(tags); + tags += "" + i + "" + field_data[idx].prop[i] + ""; + }else{ + tags += "" + i + "" + field_data[idx].prop[i] + ""; + } + } + $("#fieldDataBody").append(tags); - nowPagingOn(idx); - resetObjStyle(); + nowPagingOn(idx); + resetObjStyle(); - //중심좌표 구하기? - //var aa = feature.getGeometry().v; - //var oo = ol.extent.getCenter(aa); + //중심좌표 구하기? + //var aa = feature.getGeometry().v; + //var oo = ol.extent.getCenter(aa); - var center = field_data[idx].center; - var feature = getObjFeatureByIdx(idx); + var center = field_data[idx].center; + var feature = getObjFeatureByIdx(idx); - moveCenter(center); - if (feature) { + moveCenter(center); + if (feature) { feature.set("selected", true); -} + } } - function nowPagingOn(idx){ - $(".paging_li").removeClass("fieldPagingOn") - $("#paging_li"+idx).attr("class", "fieldPagingOn paging_li"); +function nowPagingOn(idx){ + $(".paging_li").removeClass("fieldPagingOn") + $("#paging_li"+idx).attr("class", "fieldPagingOn paging_li"); } - function makePropPaging() { - var pagingNumber = 0; - for (var idx in field_data) { +function makePropPaging() { + var pagingNumber = 0; + for (var idx in field_data) { pagingNumber++; $("#fieldDataPaging").append('
    • ' + pagingNumber+ '
      • '); -} + } } - function drawingObj() { - objVectorSource.clear(); - var objFeatures = []; - for (var idx in field_data) { +function drawingObj() { + objVectorSource.clear(); + map.addLayer(objVectorLayer); + var objFeatures = []; + for (var idx in field_data) { var objFeature = format.readFeature(field_data[idx].WKT, { - dataProjection : 'EPSG:5186', - featureProjection : 'EPSG:3857' -}); + dataProjection : 'EPSG:5186', + featureProjection : 'EPSG:3857' + }); objFeature.setProperties({ - "idx" : idx, - "selected" : false -}); + "idx" : idx, + "selected" : false + }); objFeatures.push(objFeature); -} - objVectorSource.addFeatures(objFeatures); - map.addLayer(objVectorLayer); + } + objVectorSource.addFeatures(objFeatures); } - function moveCenter(center) { - var coordinates = ol.proj.transform(center, 'EPSG:5186', 'EPSG:3857'); - map.getView().setCenter(coordinates); +function moveCenter(center) { + var coordinates = ol.proj.transform(center, 'EPSG:5186', 'EPSG:3857'); + map.getView().setCenter(coordinates); } - function getObjFeatureBySelected() { - var features = objVectorSource.getFeatures(); - var feature = null; +function getObjFeatureBySelected() { + var features = objVectorSource.getFeatures(); + var feature = null; - for (var i = 0, size = features.length; i < size; i++) { + for (var i = 0, size = features.length; i < size; i++) { if (features[i].get('selected') == true) { - feature = features[i]; - break; -} -} - return feature; + feature = features[i]; + break; + } + } + return feature; } - function getObjFeatureByIdx(idx) { - var features = objVectorSource.getFeatures(); - var feature = null; - for (var i = 0, size = features.length; i < size; i++) { +function getObjFeatureByIdx(idx) { + var features = objVectorSource.getFeatures(); + var feature = null; + for (var i = 0, size = features.length; i < size; i++) { if (features[i].get('idx') == idx) { - feature = features[i]; - break; -} -} - return feature; -} + feature = features[i]; + break; + } + } + return feature; +} \ No newline at end of file