图层管理DEM切换，根据项目进行筛选；顶部菜单优化

Surpriseplus

2023-05-10 28eabcf57517e503618d9217e8bf6cd4b6b96cc7

图层管理DEM切换，根据项目进行筛选；顶部菜单优化

 src/components/mapsdk.vue

@@ -80,16 +80,24 @@
            <el-form
              ref="form"
              :model="coordFrom"

            >
              <el-form-item label="经度:">
                <el-input v-model="coordFrom.lon" placeholder="请输入经度"></el-input>
                <el-input
                  v-model="coordFrom.lon"
                  placeholder="请输入经度"
                ></el-input>
              </el-form-item>
              <el-form-item label="纬度:">
                <el-input v-model="coordFrom.lat" placeholder="请输入维度"></el-input>
                <el-input
                  v-model="coordFrom.lat"
                  placeholder="请输入维度"
                ></el-input>
              </el-form-item>
              <el-form-item label="高度:">
                <el-input v-model="coordFrom.height" placeholder="请输入高度"></el-input>
                <el-input
                  v-model="coordFrom.height"
                  placeholder="请输入高度"
                ></el-input>
              </el-form-item>
              <el-form-item>
                <el-button
@@ -854,7 +862,7 @@
      },
      coordFrom: {
        lon: "",
        lat:"",
        lat: "",
        height: "",
      },
      listData: {
@@ -1173,24 +1181,25 @@
    changeTerrainLayer() {
      if (this.terrainflag) {
        Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider();
        window.terrainDemLayer = null;
        var option = {
          url: window.sceneConfig.SGUrl,
          layerName: window.sceneConfig.mptName,
          requestVertexNormals: true,
        };
        window.terrainLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, "");
        window.terrainMptLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, "");
        Viewer.camera.flyTo({
          destination: Cesium.Cartesian3.fromDegrees(110, 33, 8000000),
        });

      } else {
        window.terrainLayer.deleteObject();
        window.terrainLayer = null;
        window.terrainMptLayer.deleteObject();
        window.terrainMptLayer = null;

        window.terrainLayer = new Cesium.CesiumTerrainProvider({
        window.terrainDemLayer = new Cesium.CesiumTerrainProvider({
          url: LFData + '/3d/terrain/dem20230321'
        });
        Viewer.terrainProvider = window.terrainLayer
        Viewer.terrainProvider = window.terrainDemLayer
        Viewer.camera.flyTo({
          destination: Cesium.Cartesian3.fromDegrees(113.229279, 31.215949, 1000),
          orientation: {

 src/components/navMenu.vue

@@ -152,7 +152,13 @@
    document.body.addEventListener('click', () => {
      this.showFlag = null;
    }, false);

    // this.$bus.$on('closeMenuSecond', res => {
    //   this.showFlag = null;
    // })
    window.addEventListener('message', (e) => {
      console.log("e", e.data)
      this.showFlag = null;
    })
  },
  computed: {},
  methods: {

 src/views/PackageTwo/WareInspection.vue

@@ -91,6 +91,7 @@
      this.url = res
      // sessionStorage.setItem('routerName', this.reportUrl)
      console.log("2", this.reportUrl)
      // window.addEventListener("message", this.handleMessage, false);
    },

    setLiClick(res, index) {
@@ -119,20 +120,27 @@
        Vue.set(this.listMenu, index, newItem);
      }
    },
    getFunc() {
      console.log("closeMenuSecond")
      this.$bus.$emit('closeMenuSecond', false)
    }
  },
  mounted() {

    // var iframe = document.getElementById('iframeContainer');
    // iframe.onload = function (res) {

    // const iframe = document.querySelector('#iframeContainer')
    // // 处理兼容行问题
    // if (iframe.attachEvent) {
    //   iframe.attachEvent('onload', () => {
    //     // iframe加载完毕以后执行操作
    //     this.getFunc()
    //   })
    // } else {
    //   iframe.onload = () => {
    //     // iframe加载完毕以后执行操作
    //     this.getFunc()
    //   }
    // }

    // $('#iframeContainer').click = function () {
    //   console.log('点击了iframe页面')
    //   // if (window.sessionStorage.getItem('xxxLastTime') !== null) {
    //   //   window.sessionStorage.setItem('xxxLastTime', new Date().getTime())
    //   // }
    // };
    if (sessionStorage.getItem('routerName') === '/WareInspection') {

      this.showChangeIfream(sessionStorage.getItem('iframehttpurl'))

 src/views/Tools/LayerTree.vue

@@ -634,6 +634,7 @@
      console.log("tree drop: ", dropNode.label, dropType);
    },
    handleCheckChange(data, checked, indeterminate) {

      if (data.type == 1) {
        this.childOption = [];
        this.getchilds(data);
@@ -642,6 +643,7 @@
        var listTileset = [];
        var listTMS = [];
        var listMpt = [];
        var listDem = [];
        for (var i in this.childOption) {
          switch (this.childOption[i].serveType) {
            case 'WMS':
@@ -659,7 +661,9 @@
            case 'TMS':
              listTMS.push(this.childOption[i])
              break;

            case 'DEM':
              listDem.push(this.childOption[i])
              break;
          }
        }
        this.setChangeWMS(listWMS, checked);
@@ -667,6 +671,7 @@
        this.setChangeTileset(listTileset, checked);
        this.setChangeTMS(listTMS, checked);
        this.setChangeMpt(listMpt, checked);
        this.setChangeDem(listDem, checked);
      } else if (data.type == 2) {
        if (data.serveType == "WMS") {
          this.setChangeWMS([data], checked);
@@ -676,75 +681,44 @@
          this.setChangeTMS([data], checked);
        } else if (data.serveType == "Mpt") {
          this.setChangeMpt([data], checked);
        } else if (data.serveType == "DEM") {
          this.setChangeDem([data], checked);
        }
      }
      // if (data.type != 2) return;




      // if (data.serveType == "WFS") {
      //   if (window.Viewer.dataSources._dataSources.length == 0) {
      //     this.setAddLayers(data);
      //   } else {

      //   }
      // } else if (data.serveType == "Tileset") {

      //   if (Viewer.scene.primitives._primitives.length == 0) {
      //     this.setAddLayers(data);
      //   } else {
      //     var std = [];
      //     for (var i in Viewer.scene.primitives._primitives) {
      //       Viewer.scene.primitives._primitives[i].show = checked;
      //       if (Viewer.scene.primitives._primitives[i].id == data.cnName) {
      //         std.push(data.id);
      //         Viewer.flyTo(Viewer.scene.primitives._primitives[i]);
      //       }
      //     }
      //   }
      //   if (std.length == 0 && checked == true) {
      //     this.setAddLayers(data);
      //   } else {
      //     window.map.getLayers().getArray().forEach(item => {
      //       if (item.get("name") == data.cnName) {
      //         item.setVisible(checked);

      //       }
      //     });
      //   }
      // } else if (data.serveType == "TMS") {

      //   if (data.pubid) {

      //   } else {
      //     var res;
      //     if (data.url.indexOf("{host}") != -1) {
      //       res = data.url.replace("{host}", iisHost);
      //     } else {
      //       res = data.url
      //     }
      //     var url = res.split(';')

      //     window.sgworld.Creator.createImageryProvider('mpt影像', "wms", {
      //       url: url[0],
      //       layers: url[1]
      //     }, "0", undefined, true, "");
      //   }

      // }




      // var layers_ol = window.map.getAllLayers();
      // for (var i in layers_ol) {
      //   var layerOl = layers_ol[i];
      //   if (layerOl.values_.name == data.label) {
      //     layerOl.setVisible(checked); //显示图层
      //   }
      // }
    },
    setChangeDem(data, checked) {
      this.cannelTerrainLayer();
      var val = this.$refs.tree.getCheckedKeys();
      var std = [];
      for (var i = 0; i < val.length; i++) {
        var res = this.$refs.tree.getNode(val[i]).data;
        if (res.serveType && res.serveType != 'DEM') {
          std.push(val[i])
        }
      }
      var result = data[0]
      if (this.$refs.tree.getNode(result.id).checked) {
        std.push(result.id);
        var base_ulr = result.url;
        if (base_ulr.indexOf('{host}') > -1) {
          base_ulr = base_ulr.replace("{host}", iisHost)
        }

        this.setTerrainDemLayer(base_ulr);
      } else {
        this.setTerrainMptLayer();
      }
      this.$refs.tree.setCheckedKeys(std)
      // 
      // this.$nextTick(() => {
      //  
      // });

      // setTimeout(() => {
      //   
      // }, 500);
    },

    setChangeWMS(result, checked) {
      var value = this.$refs.tree.getCheckedNodes();
      this.$bus.$emit("showMenuLayer", value);
@@ -800,20 +774,6 @@
          }
        }
      }



      // if (checked.checkedKeys) {
      //   for (var i in result) {
      //
      //   }
      // } else {

      //   for (var j in result) {
      //     console.log(result[j])
      //     //
      //   }
      // }
    },
    setChangeMpt(result, checked) {
      var value = this.$refs.tree.getCheckedNodes();
@@ -1245,6 +1205,7 @@
    },
    getNewTree(obj, result) {
      for (const i in obj) {
        console.log(obj[i].cnName)
        result.push(obj[i])
        if (obj[i].children && obj[i].children.length > 0) {
          this.getNewTree(obj[i].children, result)
@@ -1271,6 +1232,7 @@
            return rs
          }
        })
        debugger
        var val = this.$store.state.oldTree.filter(rs => {
          if (rs.enName == st_code[0].code) {
            return rs
@@ -1299,22 +1261,29 @@
          }

        }
        this.cannelTerrainLayer();
        this.setTerrainMptLayer();
        //清空图层树选中状态
        this.$refs.tree.setCheckedKeys([]);
        if (val.length > 0) {

          if (val[0].type == 1 && val[0].isProject == 1) {//项目分类
            var std = [];

            var std_check = [];
            for (var i in val) {
              var std_val = this.getNewTree([this.$refs.tree.getNode(val[i].id).data], [])
              for (var j in std_val) {
                std.push(std_val[j])
                std_check.push(std_val[j])
              }
            }


            var value = this.$store.state.isProjectLayer;
            for (var i in value) {
              std.push(value[i])

              std_check.push(value[i])
            }


            this.setProjectLayer(std);
            this.setProjectLayer(std_check);
          } else {
            this.setChangeProLayer();
          }
@@ -1333,13 +1302,34 @@
        }

        this.setProjectLayer(std);


      }


    },

    cannelTerrainLayer() {
      //清空地形
      if (window.terrainMptLayer) {
        window.terrainMptLayer.deleteObject();
        window.terrainMptLayer = null;
      }
      if (window.terrainDemLayer) {
        Viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider();
        window.terrainDemLayer = null;
      }
    },
    setTerrainMptLayer() {
      //默认地形MPT
      var option = {
        url: window.sceneConfig.SGUrl,
        layerName: window.sceneConfig.mptName,
        requestVertexNormals: true,
      };
      window.terrainMptLayer = sgworld.Creator.sfsterrainprovider("", option, "", true, "");
    },
    setTerrainDemLayer(res) {
      window.terrainDemLayer = new Cesium.CesiumTerrainProvider({
        url: res
      });
      Viewer.terrainProvider = window.terrainDemLayer
    },
    setProjectLayer(res) {
      var layerid = [];
      for (var i in res) {
@@ -1442,7 +1432,9 @@
    this.getMenuProject()
    this.$bus.$on("treeDataCopy", (res) => {
      this.$store.state.treeData = this.treeData;
      this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys();
      if (this.$refs.tree.getCheckedKeys().length > 0) {
        this.$store.state.checkedKeys = this.$refs.tree.getCheckedKeys();
      }
    });

    if (this.$store.state.showAllLayers == true) {