山水工程通过layersID控制图层显隐

src/views/cockpit/common/VectorSpace/BoxCommonVector.vue

@@ -99,6 +99,7 @@ import * as turf from "@turf/turf";
 
 let BoxCommonVector_entity = null;
 let layersObj = {};
+let layerSources = {};
 export default {
   data() {
     return {
@@ -123,11 +124,10 @@ export default {
       return "";
     },
     async draw_vector_server(jscType) {
-      // http://192.168.60.2:8090/iserver/services/map-ShanShuiZhiLiWorkSpace/rest/maps/%E5%B1%B1%E6%B0%B4%E6%B2%BB%E7%90%86/layers/%E5%B1%B1%E6%B0%B4%E6%B2%BB%E7%90%86.json
       let res = await QueryOne({ jscType, id: "4602" });
       this.layersData = { ...res.data, title: this.title };
       tdsy.addLayer(this.layersData);
-      this.Getlayers(res.data.url);
+      // this.Getlayers(res.data.url);
     },
     async Getlayers(mapurl) {
       let url = `${mapurl}/layers.json`;
@@ -136,22 +136,48 @@ export default {
       if (layers.length > 0) this.layersData.layerName = layers[0].name;
     },
     async setLayerStatus(item) {
-      this.tempdataLayerId = item.did;
-      if (layersObj[item.did]) {
-        layersObj[item.did].show = true;
-      } else if (this.layersData.layerName) {
-        var params_gh = {
-          layerName: this.layersData.layerName,
-          isVisible: true,
-          displayFilter: `xmmc = '${item["项目名称"]}'`,
-        };
-        tdsy.superProvider.setLayerStatusParameters([params_gh]);
-        tdsy.layer.show = false;
-        let layer = viewer.imageryLayers.addImageryProvider(tdsy.superProvider);
-        layersObj[item.did] = layer;
+      let did_v = Number(item.did) - 1;
+      this.tempdataLayerId = did_v;
+      if (layersObj[did_v]) {
+        layersObj[did_v].show = true;
+        viewer.flyTo(layerSources[did_v], {
+          offset: new Cesium.HeadingPitchRange(0, -45, 5000),
+        });
       } else {
-        Message.error("缺少图层名称，设置失败");
+        tdsy.layer.show = false;
+        let layer = viewer.imageryLayers.addImageryProvider(
+          new Cesium.SuperMapImageryProvider({
+            url: this.layersData.url,
+            layersID: `[${did_v}]`,
+          })
+        );
+        layersObj[did_v] = layer;
+        this.loadGeoJSON(item.geom);
       }
+      // } else if (this.layersData.layerName) {
+      //   var params_gh = {
+      //     layerName: this.layersData.layerName,
+      //     isVisible: true,
+      //     displayFilter: `xmmc = '${item["项目名称"]}'`,
+      //   };
+      //   tdsy.superProvider.setLayerStatusParameters([params_gh]);
+      //   tdsy.layer.show = false;
+      //   let layer = viewer.imageryLayers.addImageryProvider(tdsy.superProvider);
+      //   layersObj[item.did] = layer;
+    },
+    loadGeoJSON(geojson, id) {
+      let polygon = Cesium.GeoJsonDataSource.load(geojson, {
+        clampToGround: true,
+        stroke: Cesium.Color.WHITE.withAlpha(0),
+        fill: Cesium.Color.WHITE.withAlpha(0),
+      });
+      polygon.then(function (dataSource) {
+        viewer.dataSources.add(dataSource);
+        layerSources[id] = dataSource;
+        viewer.flyTo(dataSource, {
+          offset: new Cesium.HeadingPitchRange(0, -45, 5000),
+        });
+      });
     },
     multiPolygonToPolygons(multiPolygon) {
       const polygons = [];
@@ -505,6 +531,7 @@ export default {
   watch: {
     cockpit_vector(newVal, oldVal) {
       this.title = newVal.title;
+      console.log("---", newVal);
       this.word = newVal.word;
       this.searchs = newVal.searchs;
       this.searchform = newVal.searchform;
@@ -530,8 +557,9 @@ export default {
       if (oldVal && layersObj[oldVal]) {
         layersObj[oldVal].show = false;
       } else if (layersObj[newVal]) {
-        layersObj[newVal].show = true;
+        // layersObj[newVal].show = true;
       }
+      console.log(newVal, oldVal, "----");
     },
     computed_vectorData(newVal, oldVal) {
       newVal.forEach((res) => {
@@ -568,8 +596,8 @@ export default {
 
 <style lang="scss" scoped>
 div::-webkit-scrollbar {
-    width: 9px;
-    height: 19px;
+  width: 9px;
+  height: 19px;
 }
 .BoxCommonVector {
   width: 100%;