Browse Source

图层配置封装到配置文件中;水深点标注;

sbj 1 year ago
parent
commit
8bbf30ff6f
3 changed files with 133 additions and 36 deletions
  1. 7 0
      src/apis/hdsj.js
  2. 31 0
      src/config/layerConfig.js
  3. 95 36
      src/utils/map/Layer.js

+ 7 - 0
src/apis/hdsj.js

@@ -77,4 +77,11 @@ export function GetWhss() {
     url: '/DigitalTwin/WaterDepthSpace/getHpjArea',
     method: "post"
   })
+}
+
+export function GetHpjDepthPoints() {
+  return request({
+    url: '/DigitalTwin/GetHpjDepthPoints?distance=100',
+    method: "get"
+  })
 }

+ 31 - 0
src/config/layerConfig.js

@@ -0,0 +1,31 @@
+module.exports = {
+    digitalTwinLayer: 'https://10.83.240.193:8090/arcgis/rest/services/digitalTwain_3857/MapServer',
+    waterPassengerLayer: 'https://10.83.240.193:8090/arcgis/rest/services/water_passenger_3857/MapServer',
+    ghjgCxAllLayer: 'https://10.83.240.193:8090/arcgis/rest/services/ghjg_cxall/MapServer',
+    jjqLayer: 'https://10.83.240.193:8090/arcgis/rest/services/jingjiequ/MapServer',
+    jjqIconLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/警戒区图标/SceneServer',
+    dtqLayer: 'https://10.83.240.193:8090/arcgis/rest/services/backArea/MapServer',
+    dtqIconLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/掉头区图标/SceneServer',
+    mdLayer: 'https://10.83.240.193:8090/arcgis/rest/services/maodi/MapServer',
+    mdIconLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/锚地图标/SceneServer',
+    sszhLayer: 'https://10.83.240.193:8090/arcgis/rest/services/shuishangfuququ/MapServer',
+    sszhIconLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/水上绿色综合服务区图标/SceneServer',
+    hbLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/航标/SceneServer',
+    sxdxLayer202301: 'https://ghjg.china-gis.com/server/rest/services/Hosted/多波束/SceneServer',
+    sxdxLayer202201: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第一期2022/SceneServer',
+    sxdxLayer202202: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第二期2022/SceneServer',
+    sxdxLayer202101: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第一期2021/SceneServer',
+    sxdxLayer202102: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第二期2021/SceneServer',
+    sxdxLayer202001: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第一期2020/SceneServer',
+    sxdxLayer202002: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第二期2020/SceneServer',
+    labmhPJ500Layer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/黄浦江周边建筑500m/SceneServer',
+    labmPxLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/浦西核心段白膜/SceneServer',
+    lajmLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/黄浦江沿岸精模/SceneServer',
+    kymtLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/客运码头/SceneServer',
+    wxpmtLayer: 'https://ghjg.china-gis.com/server/rest/services/Hosted/危险品码头/SceneServer',
+    yjyjLayer202301: 'https://ghjg.china-gis.com/server/rest/services/Hosted/第一期2023淤积/SceneServer',
+    LjzSjBefore2022: 'https://ghjg.china-gis.com/server/rest/services/Hosted/疏浚前拉伸10倍/SceneServer',
+    LjzSjAfter2022: 'https://ghjg.china-gis.com/server/rest/services/Hosted/疏浚后拉伸10倍/SceneServer',
+    dm2020H2Layer:'https://ghjg.china-gis.com/server/rest/services/Hosted/断面_2020H2/SceneServer',
+
+}

+ 95 - 36
src/utils/map/Layer.js

@@ -2,8 +2,10 @@
  * 图层加载工具类
  */
 import {setBoat} from '@/utils/map/Boat'
-import {addLayer,setOpacity} from "@/utils/map/ArcgisUtil";
+import {addGraphic, addLayer, clearMap, setOpacity} from "@/utils/map/ArcgisUtil";
 import {setCenter,setSxdxCamera} from '@/utils/map/Common'
+import {GetHpjDepthPoints} from '@/apis/hdsj'
+import layerConfig from '@/config/layerConfig'
 
 // let layerList = ['cb','mt','jjq','dtq','md','sszh','hb','hd','sxdx','2023.1','2022.1','2022.2','2021.1','2021.2','2020.1','2020.2']
 let layerList = []
@@ -14,7 +16,7 @@ let defaultLayerList = [
         id: 'waterPassenger',
         title: 'waterPassenger',
         type: 'feature',
-        url:'https://10.83.240.193:8090/arcgis/rest/services/water_passenger_3857/MapServer',
+        url: layerConfig.waterPassengerLayer,
         visible: false,
         opacity: 1,
         token: '',
@@ -25,7 +27,7 @@ let defaultLayerList = [
         id: 'digitalTwain',
         title: 'digitalTwain',
         type: 'feature',
-        url:'https://10.83.240.193:8090/arcgis/rest/services/digitalTwain_3857/MapServer',
+        url: layerConfig.digitalTwinLayer,
         visible: false,
         opacity: 1,
         token: '',
@@ -36,7 +38,7 @@ let defaultLayerList = [
         id: 'ghjgCxall',
         title: 'ghjgCxall',
         type: 'shc_map',
-        url:'https://10.83.240.193:8090/arcgis/rest/services/ghjg_cxall/MapServer',
+        url:layerConfig.ghjgCxAllLayer,
         visible: false,
         opacity: 1,
         token: '',
@@ -98,7 +100,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'portLayer',
                 title: 'portLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/digitalTwain_3857/MapServer/0',
+                url: layerConfig.digitalTwinLayer+'/0',
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -111,7 +113,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'jjqIconLayer',
                 title: 'jjqIconLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/警戒区图标/SceneServer',
+                url: layerConfig.jjqIconLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -121,7 +123,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'jjqAreaLayer',
                 title: 'jjqAreaLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/jingjiequ/MapServer',
+                url: layerConfig.jjqLayer,
                 visible: isShow,
                 opacity: opacity?opacity:0.5,
                 token: '',
@@ -135,7 +137,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'dtqIconLayer',
                 title: 'dtqIconLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/掉头区图标/SceneServer',
+                url: layerConfig.dtqIconLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -145,7 +147,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'dtqAreaLayer',
                 title: 'dtqAreaLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/backArea/MapServer',
+                url: layerConfig.dtqLayer,
                 visible: isShow,
                 opacity: opacity?opacity:0.5,
                 token: '',
@@ -158,7 +160,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'mdIconLayer',
                 title: 'mdIconLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/锚地图标/SceneServer',
+                url: layerConfig.mdIconLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -168,7 +170,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'mdAreaLayer',
                 title: 'mdAreaLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/maodi/MapServer',
+                url: layerConfig.mdLayer,
                 visible: isShow,
                 opacity: opacity?opacity:0.5,
                 token: '',
@@ -181,7 +183,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'ssfwqIconLayer',
                 title: 'ssfwqIconLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/水上绿色综合服务区图标/SceneServer',
+                url: layerConfig.sszhIconLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -191,7 +193,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'ssfwqAreaLayer',
                 title: 'ssfwqAreaLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/shuishangfuququ/MapServer',
+                url: layerConfig.sszhLayer,
                 visible: isShow,
                 opacity: opacity?opacity:0.5,
                 token: '',
@@ -204,7 +206,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'hbSceneLayer',
                 title: 'hbSceneLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/航标/SceneServer',
+                url: layerConfig.hbLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -217,7 +219,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'channelLayer',
                 title: 'channelLayer',
                 type: 'feature',
-                url: 'https://10.83.240.193:8090/arcgis/rest/services/digitalTwain_3857/MapServer/2',
+                url: layerConfig.digitalTwinLayer+'/2',
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -230,7 +232,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'dbsLayer',
                 title: 'dbsLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                url: layerConfig.sxdxLayer202301,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -249,7 +251,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202301',
                 title: 'deepthLayer202301',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                url: layerConfig.sxdxLayer202301,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -261,7 +263,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202201',
                 title: 'deepthLayer202201',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第一期2022/SceneServer',
+                url: layerConfig.sxdxLayer202201,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -273,7 +275,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202202',
                 title: 'deepthLayer202202',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第二期2022/SceneServer',
+                url: layerConfig.sxdxLayer202202,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -285,7 +287,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202101',
                 title: 'deepthLayer202101',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第一期2021/SceneServer',
+                url: layerConfig.sxdxLayer202101,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -297,7 +299,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202102',
                 title: 'deepthLayer202102',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第二期2021/SceneServer',
+                url: layerConfig.sxdxLayer202202,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -309,7 +311,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202001',
                 title: 'deepthLayer202001',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第一期2020/SceneServer',
+                url: layerConfig.sxdxLayer202001,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -321,7 +323,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'deepthLayer202002',
                 title: 'deepthLayer202002',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第二期2020/SceneServer',
+                url: layerConfig.sxdxLayer202002,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -334,7 +336,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'hpj500mBuildingLayer',
                 title: 'hpj500mBuildingLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/黄浦江周边建筑500m/SceneServer',
+                url: layerConfig.labmhPJ500Layer,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -344,7 +346,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'pxBuildingLayer',
                 title: 'pxBuildingLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/浦西核心段白膜/SceneServer',
+                url: layerConfig.labmPxLayer,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -357,7 +359,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'jmBuildingLayer',
                 title: 'jmBuildingLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/黄浦江沿岸精模/SceneServer',
+                url: layerConfig.lajmLayer,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -370,7 +372,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'kymtLayer',
                 title: 'kymtLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/客运码头/SceneServer',
+                url: layerConfig.kymtLayer,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -383,7 +385,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'yjyjLayer',
                 title: 'yjyjLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/第一期2023淤积/SceneServer',
+                url: layerConfig.yjyjLayer202301,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -394,7 +396,7 @@ export function addLayerByName(name,isShow,opacity){
                     id: 'dbsLayer',
                     title: 'dbsLayer',
                     type: 'scene',
-                    url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                    url: layerConfig.sxdxLayer202301,
                     visible: false,
                     opacity: 1,
                     token: '',
@@ -404,7 +406,7 @@ export function addLayerByName(name,isShow,opacity){
                     id: 'dbsLayer',
                     title: 'dbsLayer',
                     type: 'scene',
-                    url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                    url: layerConfig.sxdxLayer202301,
                     visible: true,
                     opacity: 0.4,
                     token: '',
@@ -415,7 +417,7 @@ export function addLayerByName(name,isShow,opacity){
                     id: 'dbsLayer',
                     title: 'dbsLayer',
                     type: 'scene',
-                    url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                    url: layerConfig.sxdxLayer202301,
                     visible: false,
                     opacity: 1,
                     token: '',
@@ -425,7 +427,7 @@ export function addLayerByName(name,isShow,opacity){
                     id: 'dbsLayer',
                     title: 'dbsLayer',
                     type: 'scene',
-                    url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/多波束/SceneServer',
+                    url: layerConfig.sxdxLayer202301,
                     visible: true,
                     opacity: 1,
                     token: '',
@@ -439,7 +441,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: '2022LjzBefore',
                 title: '2022LjzBefore',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/疏浚前拉伸10倍/SceneServer',
+                url: layerConfig.LjzSjBefore2022,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -452,7 +454,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: '2022LjzAfterLayer',
                 title: '2022LjzAfterLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/疏浚后拉伸10倍/SceneServer',
+                url: layerConfig.LjzSjAfter2022,
                 visible: isShow,
                 opacity: 1,
                 token: '',
@@ -465,7 +467,7 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'dangerPortLayer',
                 title: 'dangerPortLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/危险品码头/SceneServer',
+                url: layerConfig.wxpmtLayer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: '',
@@ -481,11 +483,68 @@ export function addLayerByName(name,isShow,opacity){
                 id: 'warterDepthLineLayer',
                 title: 'warterDepthLineLayer',
                 type: 'scene',
-                url: 'https://geoscene.geosceneonline.cn/server/rest/services/Hosted/断面_2020H2/SceneServer',
+                url: layerConfig.dm2020H2Layer,
                 visible: isShow,
                 opacity: opacity?opacity:1,
                 token: ''
             })
+
+            if(isShow){
+                GetHpjDepthPoints().then(res=>{
+                    if(res.code == '200'){
+                        if(res.data.Rows != null && res.data.Rows.length > 0){
+                            let rows = res.data.Rows
+                            let dataList = []
+                            for(let i=0;i<rows.length;i++){
+                                let linePoints = rows[i]
+                                if(linePoints.length > 0){
+                                    for(let j=0;j<linePoints.length;j++){
+                                        if(linePoints[j].depth == null){
+                                            continue
+                                        }
+                                        let point = {
+                                            x: linePoints[j].pointX,
+                                            y: linePoints[j].pointY,
+                                            z: linePoints[j].pointZ * 10,
+                                            text: linePoints[j].depth
+                                        }
+                                        dataList.push(point)
+                                    }
+                                }
+                            }
+                            addGraphic({
+                                "type": 'points',
+                                "is_edit": false,
+                                "is_clear": true,
+                                "is_temp": false,
+                                "is_goto": false,
+                                "data": dataList,
+                                "attributes": null,
+                                "symbol": {
+                                    type: "simple-marker",
+                                    style: "circle",
+                                    color: [255, 255, 255],
+                                    size: 5
+                                },
+                                "title": null
+                            })
+                        }else{
+                            this.$message({
+                                type: 'error',
+                                message: '未查询到水深点数据!'
+                            })
+                        }
+                    }else{
+                        this.$message({
+                            type: 'error',
+                            message: '查询水深点数据失败!'
+                        })
+                        console.log(res.msg)
+                    }
+                })
+            }else{
+                clearMap({is_draw: true, is_search:true, layers: []})
+            }
             break
     }
 }