添加高程以及二三维场景切换

src/components/productInfo/index.vue

@@ -1,18 +1,11 @@
 <template>
   <div class="info">
     <div class="box">
-      <el-checkbox
+      <div class="ckBox">
-        v-model="prodChecked"
+        <el-checkbox v-model="prodChecked" @change="prodCheckChanged" class="checkbox">待检验产品</el-checkbox>
-        @change="prodCheckChanged"
+        <el-checkbox v-model="sampleChecked" @change="sampleCheckChanged" class="checkbox">样本点</el-checkbox>
-        class="checkbox"
+        <el-checkbox v-model="demChecked" @change="demCheckChanged" class="checkbox">高程图层</el-checkbox>
-        >待检验产品</el-checkbox
+      </div>
-      >
-      <el-checkbox
-        v-model="sampleChecked"
-        @change="sampleCheckChanged"
-        class="checkbox"
-        >样本点</el-checkbox
-      >
     </div>
   </div>
 </template>
@@ -24,6 +17,7 @@ export default {
     return {
       prodChecked: true,
       sampleChecked: true,
+      demChecked: false,
     };
   },
   methods: {
@@ -41,6 +35,13 @@ export default {
         this.$emit("removeSample");
       }
     },
+    demCheckChanged() {
+      if (this.demChecked) {
+        this.$emit("addDemLayer");
+      } else {
+        this.$emit("removeDemLayer");
+      }
+    },
   },
 };
 </script>
@@ -56,18 +57,15 @@ export default {
   z-index: 999;
   border-radius: 4px;
 }
-.iconbox div {
+
-  width: 160px;
-  height: 75px;
-  border-radius: 5px;
-}
 .box {
-  height: 55px;
   width: 160px;
   background-color: white;
-  margin-left: 3px;
   border-radius: 5px;
   align-items: center;
-  padding: 10px 15px;
+}
+
+.ckBox {
+  margin-left: 10px;
 }
 </style>

src/lib/cesiumUtils.js

@@ -19,7 +19,7 @@ class CesiumUtils {
             timeline: false, //时间线,默认true
             navigationHelpButton: false, //导航帮助说明,默认true
             // sceneMode:Cesium.SceneMode.SCENE2D,
-            sceneModePicker: false, //是否显示投影方式控件
+            // sceneModePicker: false, //是否显示投影方式控件
             infoBox: false, //点击要素之后显示的信息,默认true
             fullscreenButton: false, //全屏按钮,默认显示true
             navigationInstructionsInitiallyVisible: false,
@@ -75,7 +75,16 @@ class CesiumUtils {
         // console.log('CesiumNavigation:', CesiumNavigation);
         CesiumNavigation(viewer, optionsNav);
     }
-
+    // 添加高程数据
+    static addDemLayer() {
+        this.viewer.scene.terrainProvider = new Cesium.ArcGISTiledElevationTerrainProvider({
+            url: "https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer"
+        });
+    }
+    // 移除高程数据
+    static removeDemLayer() {
+        this.viewer.scene.terrainProvider = new Cesium.EllipsoidTerrainProvider({});
+    }
     //添加wms
     static addlayer(geoWorkspace, layerName) {
         let matrixIds = [
@@ -162,7 +171,7 @@ class CesiumUtils {
         this.viewer.imageryLayers.remove(this.privide);
     }
 
-    static addPoint(pLon, pLat, pAlt, isSelected = false,pointId = null) {
+    static addPoint(pLon, pLat, pAlt, isSelected = false, pointId = null) {
         var pointEntity = this.viewer.entities.add({
             id: pointId,
             position: Cesium.Cartesian3.fromDegrees(pLon, pLat, 10),
@@ -179,7 +188,7 @@ class CesiumUtils {
         this.viewer.entities.removeAll();
     }
     //修改点的位置
-    static clickToAddPoint(callback){
+    static clickToAddPoint(callback) {
         //清空之前的handler
         if (this.addPointHandler) {
             this.addPointHandler.destroy();
@@ -217,8 +226,8 @@ class CesiumUtils {
         }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
     }
     //销毁监听
-    static destroyClickToAddPoint(){
+    static destroyClickToAddPoint() {
-        if(this.addPointHandler){
+        if (this.addPointHandler) {
             this.addPointHandler.destroy();
         }
     }
@@ -349,8 +358,8 @@ class CesiumUtils {
         }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
     }
     //销毁点击事件
-    static destoryHandleClick(){
+    static destoryHandleClick() {
-        if(this.clickShowPopHandler){
+        if (this.clickShowPopHandler) {
             this.clickShowPopHandler.destroy()
         }
     }

src/views/Daichuli/Feedback/index.vue

@@ -78,7 +78,7 @@
             @click="downLoadPro">下载</el-button>
         </div>
         <product-info @removeLayer="removeLayer" @addLayer="addLayer" @removeSample="removeSplData"
-          @addSample="getSqlData"></product-info>
+          @addSample="getSqlData" @addDemLayer="addDemLayer" @removeDemLayer="removeDemLayer"></product-info>
         <div class="preview">
           <div id="PendPreview" @click="pickValue" style="overflow: hidden; position: relative"></div>
         </div>
@@ -508,6 +508,12 @@ export default {
     removeLayer() {
       cu.clearLayers();
     },
+    addDemLayer() {
+      cu.addDemLayer();
+    },
+    removeDemLayer() {
+      cu.removeDemLayer();
+    },
     removeSplData() {
       cu.removePoint();
     },