zzy + 低空效果修改

src/store/mapStore.js

@@ -1,7 +1,7 @@
 import {defineStore} from "pinia";
 export const useMapStore = defineStore('map',{
     state:() =>({
-        layerShow:false,  //服务列表是否开启
+        layerShow:true,  //服务列表是否开启
         currentLayerType:"mainPage", //当前服务列表类型
         currentLayerList:[],  //当前服务列表
         currentNum:null,

src/unit/map/addLayer.js

@@ -1,6 +1,26 @@
 import {myBridge,previewMapBridge} from "./map.js";
 import {getMapToken,getServiceToken} from "../../service/map.js";
 
+
+// 白膜颜色配置
+const locationRenderer = {
+    type: "simple",
+    symbol: {
+        type: "mesh-3d",
+        symbolLayers: [{
+            type: "fill",
+            material: {
+                color: [255, 255, 255, 1],
+                colorMixMode: "tint"
+            },
+            edges: {
+                type: 'solid',
+                color: [0, 0, 0, 0.5],
+                size: 1
+            }
+        }]
+    }
+};
 export function invokeParams(ActionName,params){
     getMapToken().then(res =>{
         let token = res.data.msg[0].Rows[0].token;
@@ -55,6 +75,192 @@ export function SetBackground(){
     })
 }
 
+export function AddWhiteMold(visible){
+    invokeParams('AddSingleLayer', {
+        "id": "AllWhiteMold",
+        "title": "全市白模",
+        "visible": visible,
+        "opacity": 0.4,
+        "renderer":locationRenderer,
+        "url": "https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/ptgl/05195418",
+        "type": "scene",
+    })
+    invokeParams('AddSingleLayer', {
+        "id": "whiteMold",
+        "title": "局部白模",
+        "visible": visible,
+        "opacity": 0,
+        "renderer":locationRenderer,
+        "url": "https://serve3d41.gis.cn:6443/geoscene/rest/services/Hosted/baimo_dikong/SceneServer",
+        "type": "scene",
+    })
+    invokeParams('AddSingleLayer', {
+        "id": "ksl",
+        "title": "快速路",
+        "visible": visible,
+        "opacity": 1,
+        //"url": "https://serve2d31.gis.cn:6443/geoscene/rest/services/06-sz/060108003100000000000120240151202401/MapServer",
+        "url": "https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/D7002000420150601",
+        "type": "tile",
+    })
+    invokeParams('AddSingleLayer', {
+        "id": "gsgl",
+        "title": "高速公路",
+        "visible": visible,
+        "opacity": 1,
+        //"url": "https://serve2d31.gis.cn:6443/geoscene/rest/services/06-sz/060203053100000000000120240151202401/MapServer",
+        "url": "https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/D7002000320150601",
+        "type": "tile",
+    })
+    invokeParams('AddSingleLayer', {
+        "id": "dmdl",
+        "title": "地面道路",
+        "visible": visible,
+        "opacity": 1,
+        //"url": "https://serve2d31.gis.cn:6443/geoscene/rest/services/06-sz/060101013100000000000120240151202401/MapServer",
+        "url": "https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/D7002000220150601",
+        "type": "tile",
+    })
+    invokeParams('AddSingleLayer', {
+        "id": "gyld",
+        "title": "公园绿地",
+        "visible": visible,
+        "opacity": 1,
+        //"url": "https://serve2d31.gis.cn:6443/geoscene/rest/services/09-lhly/090101013100000000000120240101202401/MapServer",
+        "url": "https://cimweb.zjw.sh.cegn.cn:2008/MapProxyApi/getSceneServer/gxjh_fwjk/D0901010320150601",
+        "type": "dynamic",
+    })
+}
+
+export function GroundPrismEffect(status){
+    invokeParams('GroundPrismEffect', {
+        "status": status,
+        "rings": [
+            [
+                [
+                    1536.9350492273984,
+                    1495.3300997539745
+                ],
+                [
+                    3704.5161538791876,
+                    1434.1823051423912
+                ],
+                [
+                    3656.0675266734356,
+                    -283.2357889128476
+                ],
+                [
+                    1488.4864220216464,
+                    -222.08799430126427
+                ],
+                [
+                    1536.9350492273984,
+                    1495.3300997539745
+                ]
+            ]
+        ],
+        "items": [
+            {
+                "id": 1,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    201,254,246,
+                    0.2
+                ]
+            },
+            {
+                "id": 2,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    180,240,249,
+                    0.24
+                ]
+            },
+            {
+                "id": 3,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    151,220,252,
+                    0.28
+                ]
+            },
+            {
+                "id": 4,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    118,198,254,
+                    0.32
+                ]
+            },
+            {
+                "id": 5,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    81,174,255,
+                    0.36
+                ]
+            },
+            {
+                "id": 6,
+                "name": "",
+                "depth": 100,
+                "material": [
+                    46,153,255,
+                    0.40
+                ]
+            },
+            {
+                "id": 7,
+                "name": "",
+                "depth": 400,
+                "material": [
+                    4,138,255,
+                    0.44
+                ]
+            }
+        ]
+    })
+}
+
+export function LimitHeightAnalysis(params){
+    invokeParams('LimitHeightAnalysis', {
+        "status":params.status,
+        "distance":params.start,
+        "distanceEnd":params.end,
+        "rings":  [
+            [
+                [
+                    1536.9350492273984,
+                    1495.3300997539745
+                ],
+                [
+                    3704.5161538791876,
+                    1434.1823051423912
+                ],
+                [
+                    3656.0675266734356,
+                    -283.2357889128476
+                ],
+                [
+                    1488.4864220216464,
+                    -222.08799430126427
+                ],
+                [
+                    1536.9350492273984,
+                    1495.3300997539745
+                ]
+            ]
+        ],
+        "maxNode":7
+    })
+}
+
+
 export function FeatureThreeDimension(params){
     debugger
     if(params.token){

src/views/c-cpns/Map.vue

@@ -12,9 +12,9 @@ import {myBridge} from "../../unit/map/map.js";
 import {useMapStore} from "../../store/mapStore.js";
 import {nextTick,ref,onMounted} from "vue";
 import {
-  AddSingleLayer,
+  AddSingleLayer, AddWhiteMold,
   AreaJsonRankShow,
-  FeatureThreeDimension,
+  FeatureThreeDimension, GroundPrismEffect,
   MapClickByType,
   SetBackground
 } from "../../unit/map/addLayer.js";
@@ -27,79 +27,19 @@ export default {
     onMounted(()=>{
       myBridge.bridgeContent =  bridge = new CityGis.Bridge({
         id: "i_map",
-        url: 'https://cimweb.zjw.sh.cegn.cn:2007/VUE-Map-Tool-Widget/#/jk_map?theme=dark_hyjcsjk&type=3D', //建科发布
-        //url: 'http://localhost:8081/#/jk_map?theme=dark_hyjcsjk&type=3D',
+        //url: 'https://cimweb.zjw.sh.cegn.cn:2007/VUE-Map-Tool-Widget/#/jk_map?theme=dark_hyjcsjk&type=3D', //建科发布
+        url: 'http://localhost:8081/#/jk_map?theme=dark_hyjcsjk&type=3D',
         onReady: function () {
           console.log("地图创建完成")
         }
       })
       MapClickByType('show');
-      SetBackground();
+      AddWhiteMold(true);
+      GroundPrismEffect("show")
       bridge.addEventListener(arg => {
         switch (arg.action) {
           case "MapExtentChanged":
             let scale = arg.data.scale;
-            if(mapStore.currentNum){
-              if(scale > 100000 && mapStore.scale  <= 100000){
-                getMapNum('county',mapStore.currentNum).then(res =>{
-                  debugger
-                  let data = res.data.data;
-                  let zxCount = 0;
-                  let zxList = ['黄浦区','徐汇区','长宁区','静安区','普陀区','虹口区','杨浦区']
-                  data.forEach(item =>{
-                    if(zxList.indexOf(item.name) > -1){
-                      zxCount += item.value * 1;
-                    }
-                  })
-                  data.push({
-                    name:"中心城区",
-                    value:zxCount
-                  })
-                  debugger
-                  AreaJsonRankShow({
-                    type:"zx",
-                    status:"show",
-                    data:data
-                  });
-                })
-              }else if(scale > 80000 && mapStore.scale  <= 80000 ){
-                debugger
-                getMapNum('county',mapStore.currentNum).then(res =>{
-                  debugger
-                  let data = res.data.data
-                  AreaJsonRankShow({
-                    type:"qx",
-                    status:"show",
-                    data:data
-                  });
-                })
-              }else if(scale < 70000 && mapStore.scale  >= 70000){
-                getMapNum('street',mapStore.currentNum).then(res =>{
-                  debugger
-                  let data = res.data.data
-                  AreaJsonRankShow({
-                    type:"jz",
-                    status:"show",
-                    data:data
-                  });
-                })
-              }
-              if(scale < 6000 && mapStore.scale  >= 6000){
-                debugger
-                FeatureThreeDimension({
-                  url:mapStore.currentLayer.ADDRESS,
-                  token:mapStore.currentLayer.TOKEN,
-                  status:"show"
-                });
-              }else if(scale > 6000 && mapStore.scale  <= 6000){
-                debugger
-                FeatureThreeDimension({
-                  url:mapStore.currentLayer.ADDRESS,
-                  token:mapStore.currentLayer.TOKEN,
-                  status:"hide"
-                });
-              }
-            }
             mapStore.scale = scale;
             break;
         }

src/views/c-cpns/ServiceTree.vue

@@ -337,7 +337,7 @@ export default {
   }
   position: absolute;
   z-index: 2;
-  left: 460px;
+  left: 20px;
   top: 87px;
   width: 370px;
   height: 553px;

src/views/c-cpns/VisualizationHeader.vue

@@ -2,7 +2,7 @@
   <div id="visualizationHeader">
     <div class="left-title">
       <span>
-         上海市住建行业基础数据库应用系统
+         低空经济
       </span>
     </div>
     <div class="top-menu">
@@ -70,7 +70,7 @@ export default {
     function logOut(){
       userStore.userInfo = {};
       localStorage.setItem('exchangeUserInfo',null);
-      window.location.href='https://cimweb.zjw.sh.cegn.cn:2007/cim-home/#/login';
+      //window.location.href='https://cimweb.zjw.sh.cegn.cn:2007/cim-home/#/login';
     }
     return {
       logOut,

src/views/c-views/visualizationPart/VisualizationHome.vue

@@ -2,16 +2,12 @@
   <div id="visualizationHome">
     <VisualizationHeader />
     <Map/>
-    <TreeMenu />
     <ServiceTree/>
     <FigureLegend />
     <BaseMapSwitch />
     <router-view/>
     <BoardSwitch />
     <VisualizationBottom />
-    <template v-if="mapStore.layerDetailShow">
-      <LayerDetailDialog :dia-attrs="{modal:false}"  />
-    </template>
   </div>
 </template>
 

src/views/c-views/visualizationPart/mainPage/MainPage.vue

@@ -1,6 +1,5 @@
 <template>
   <div id="mainPage">
-    <MainPageLeft />
     <MainPageRight />
   </div>
 </template>

src/views/c-views/visualizationPart/mainPage/mainPageRight/MainPageRight.vue

@@ -1,18 +1,8 @@
 <template>
   <div id="mainPageRight" :class="[useMapStore().right_board?'switch-right-active':'switch-right']">
-    <!-- 市政设施类型 -->
-    <MunicipalFacilities></MunicipalFacilities>
-    <!-- 道路预警 -->
-    <RoadWarnings></RoadWarnings>
-    <!-- 桥梁隐患 -->
-    <BridgeHazards></BridgeHazards>
-    <!-- 供水管线敷设方式 -->
-    <PipelineLaying></PipelineLaying>
-    <!-- 供水管线风险 -->
-    <PipelineRisk></PipelineRisk>
-
-
-
+    <div v-for="(item ,index) in list" :key="index" class="single" @click="showHeightLimit(item)" :class="[item.chosen?'single-icon-chosen':'single-icon']">
+      <span>{{item.label}}</span>
+    </div>
   </div>
 </template>
 
@@ -23,8 +13,73 @@ import BridgeHazards from '@/components/BridgeHazards.vue'
 import PipelineLaying from '@/components/PipelineLaying.vue'
 import PipelineRisk from '@/components/PipelineRisk.vue'
 import {useMapStore} from "@/store/mapStore.js";
-
-
+import {GroundPrismEffect, LimitHeightAnalysis} from "@/unit/map/addLayer.js";
+const list = [
+  {
+    label:'600米-1000米',
+    chosen:false,
+    value: {
+      start:600,
+      end:1000
+    },
+  },
+  {
+    label:'500米-600米',
+    chosen:false,
+    value: {
+      start:500,
+      end:600
+    },
+  },
+  {
+    label:'400米-500米',
+    chosen:false,
+    value: {
+      start:400,
+      end:500
+    },
+  },
+  {
+    label:'300米-400米',
+    chosen:false,
+    value: {
+      start:300,
+      end:400
+    },
+  },
+  {
+    label:'200米-300米',
+    chosen:false,
+    value: {
+      start:200,
+      end:300
+    },
+  },
+  {
+    label:'100米-200米',
+    chosen:false,
+    value: {
+      start:100,
+      end:200
+    },
+  },
+  {
+    label:'0米-100米',
+    chosen:false,
+    value: {
+      start:0,
+      end:100
+    },
+  }
+]
+function showHeightLimit(item){
+  GroundPrismEffect("hide");
+  LimitHeightAnalysis({
+    start:item.value.start,
+    end:item.value.end,
+    status:"show"
+  })
+}
 </script>
 
 <style scoped lang="scss">
@@ -33,8 +88,30 @@ import {useMapStore} from "@/store/mapStore.js";
   right: 20px;
   top: 87px;
   width: 420px;
-  height: 973px;
-  background-color: rgba(0,22,52,0.75);
+  .single{
+    width: 400px;
+    height: 65px;
+    margin-top: 30px;
+    margin-bottom: 30px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    span{
+      color:rgba(255,255,255,0.8);
+      font-size: 16px;
+    }
+  }
+  .single-icon{
+    cursor: pointer;
+    background-image: url("../../../../../assets/imgs/lowAltitude/board.png");
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+  }
+  .single-icon-chosen{
+    background-image: url("../../../../../assets/imgs/lowAltitude/board_chosen.png");
+    background-repeat: no-repeat;
+    background-size: 100% 100%;
+  }
 }
 .switch-right-active{
   transition-property: transform;