feat: expose the method of getting extrudedHeight

zouyaoji · Aug 10, 2022 · 0335706 · 0335706
1 parent 96aa4cc
commit 0335706
Show file tree

Hide file tree

Showing 3 changed files with 42 additions and 16 deletions.
diff --git a/packages/components/analyses/flood/index.ts b/packages/components/analyses/flood/index.ts
@@ -1,10 +1,10 @@
 /*
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2021-12-31 10:30:21
- * @LastEditTime: 2022-03-09 22:55:14
+ * @LastEditTime: 2022-08-10 21:36:23
  * @LastEditors: zouyaoji
  * @Description:
- * @FilePath: \vue-cesium@next\packages\components\analyses\flood\index.ts
+ * @FilePath: \10_vue-cesium\packages\components\analyses\flood\index.ts
  */
 import { defineComponent, getCurrentInstance, PropType, ref, h, createCommentVNode, WatchStopHandle, onUnmounted, watch } from 'vue'
 import { polygonHierarchy } from '@vue-cesium/utils/cesium-props'
@@ -126,8 +126,8 @@ export default defineComponent({
       }
     }
 
-    const start = () => {
-      extrudedHeight.value = props.minHeight
+    const start = (height?: number) => {
+      extrudedHeight.value = Cesium.defined(height) ? height : props.minHeight
       flooding.value = true
     }
 
@@ -153,7 +153,8 @@ export default defineComponent({
     Object.assign(instance.proxy, {
       start,
       pause,
-      stop
+      stop,
+      getCurrentHeight: () => extrudedHeight.value
     })
 
     return () => {
@@ -239,7 +240,7 @@ export interface VcAnalysisFloodRef extends VcComponentPublicInstance<VcAnalysis
   /**
    * Start flood analysis
    */
-  start: () => void
+  start: (height?: number) => void
   /**
    * Pause flood analysis
    */
@@ -248,4 +249,8 @@ export interface VcAnalysisFloodRef extends VcComponentPublicInstance<VcAnalysis
    * Stop flood analysis
    */
   stop: (removeLatest?: boolean) => void
+  /**
+   * Get the extrudedHeight value.
+   */
+  getCurrentHeight: () => number
 }
diff --git a/website/docs/en-US/analyses/vc-analysis-flood.md b/website/docs/en-US/analyses/vc-analysis-flood.md
@@ -1,10 +1,10 @@
 <!--
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2021-12-31 12:16:42
- * @LastEditTime: 2022-03-09 09:49:38
+ * @LastEditTime: 2022-08-10 21:50:54
  * @LastEditors: zouyaoji
  * @Description:
- * @FilePath: \vue-cesium@next\website\docs\en-US\analyses\vc-analysis-flood.md
+ * @FilePath: \10_vue-cesium\website\docs\en-US\analyses\vc-analysis-flood.md
 -->
 
 ## VcAnalysisFlood
@@ -29,6 +29,7 @@ Basic usage of VcAnalysisFlood component.
       :max-height="maxHeight"
       :speed="speed"
       :polygon-hierarchy="polygonHierarchy"
+      @stop="onStoped"
     >
     </vc-analysis-flood>
     <vc-layer-imagery>
@@ -41,7 +42,7 @@ Basic usage of VcAnalysisFlood component.
     <el-button type="danger" round @click="load">Load</el-button>
     <el-button type="danger" round @click="reload">Reload</el-button>
     <el-button type="danger" round @click="start">Start</el-button>
-    <el-button type="danger" round @click="pause">{{pausing ? 'Play' : 'Pause'}}</el-button>
+    <el-button :disabled="!starting" type="danger" round @click="pause">{{pausing ? 'Play' : 'Pause'}}</el-button>
     <el-button type="danger" round @click="stop">Stop</el-button>
   </el-row>
 </el-row>
@@ -59,7 +60,8 @@ Basic usage of VcAnalysisFlood component.
           [106.2, 33.5],
           [102.1, 33.5]
         ],
-        pausing: false
+        pausing: false,
+        starting: false
       }
     },
     methods: {
@@ -89,6 +91,7 @@ Basic usage of VcAnalysisFlood component.
       start() {
         this.$refs.flood.start()
         this.pausing = false
+        this.starting = true
       },
       pause() {
         this.$refs.flood.pause()
@@ -97,6 +100,12 @@ Basic usage of VcAnalysisFlood component.
       stop() {
         this.$refs.flood.stop()
         this.pausing = false
+        this.starting = false
+      },
+      onStoped(e) {
+        this.pausing = false
+        this.starting = false
+        console.log(e)
       }
     }
   }
@@ -135,6 +144,7 @@ Basic usage of VcAnalysisFlood component.
 | unload             | () => Promise\<boolean\>                | Destroy the loaded component manually.          |
 | getCreatingPromise | () => Promise<boolean \| VcReadyObject> | Get the creatingPromise.                        |
 | getCesiumObject    | () => VcCesiumObject                    | Get the Cesium object loaded by this component. |
-| start              | () => void                              | Start flood analysis.                           |
+| start              | (height?: number) => void               | Start flood analysis.                           |
 | pause              | () => void                              | Pause/resume flood analysis.                    |
 | stop               | () => void                              | Stop flood analysis.                            |
+| getCurrentHeight   | () => number                            | Get the extrudedHeight value.                   |
diff --git a/website/docs/zh-CN/analyses/vc-analysis-flood.md b/website/docs/zh-CN/analyses/vc-analysis-flood.md
@@ -1,10 +1,10 @@
 <!--
  * @Author: zouyaoji@https://github.com/zouyaoji
  * @Date: 2021-12-31 12:16:42
- * @LastEditTime: 2022-03-09 09:48:46
+ * @LastEditTime: 2022-08-10 21:49:14
  * @LastEditors: zouyaoji
  * @Description:
- * @FilePath: \vue-cesium@next\website\docs\zh-CN\analyses\vc-analysis-flood.md
+ * @FilePath: \10_vue-cesium\website\docs\zh-CN\analyses\vc-analysis-flood.md
 -->
 
 ## VcAnalysisFlood
@@ -29,6 +29,7 @@
       :max-height="maxHeight"
       :speed="speed"
       :polygon-hierarchy="polygonHierarchy"
+      @stop="onStoped"
     >
     </vc-analysis-flood>
     <vc-layer-imagery>
@@ -41,7 +42,7 @@
     <el-button type="danger" round @click="load">加载</el-button>
     <el-button type="danger" round @click="reload">重载</el-button>
     <el-button type="danger" round @click="start">开始</el-button>
-    <el-button type="danger" round @click="pause">{{pausing ? '继续' : '暂停'}}</el-button>
+    <el-button :disabled="!starting" type="danger" round @click="pause">{{pausing ? '继续' : '暂停'}}</el-button>
     <el-button type="danger" round @click="stop">结束</el-button>
   </el-row>
 </el-row>
@@ -59,14 +60,16 @@
           [106.2, 33.5],
           [102.1, 33.5]
         ],
-        pausing: false
+        pausing: false,
+        starting: false
       }
     },
     methods: {
       ready(cesiumInstance) {
         console.log(cesiumInstance)
       },
       onViewerReady({ Cesium, viewer }) {
+        window.vm = this
         viewer.scene.globe.depthTestAgainstTerrain = true
         viewer.camera.setView({
           destination: new Cesium.Cartesian3(-1432246.8223880068, 5761224.588247942, 3297281.1889481535),
@@ -89,6 +92,7 @@
       start() {
         this.$refs.flood.start()
         this.pausing = false
+        this.starting = true
       },
       pause() {
         this.$refs.flood.pause()
@@ -97,6 +101,12 @@
       stop() {
         this.$refs.flood.stop()
         this.pausing = false
+        this.starting = false
+      },
+      onStoped(e) {
+        this.pausing = false
+        this.starting = false
+        console.log(e)
       }
     }
   }
@@ -134,6 +144,7 @@
 | unload             | () => Promise\<boolean\>                | 手动卸载组件。                              |
 | getCreatingPromise | () => Promise<boolean \| VcReadyObject> | 获取标志该组件是否创建成功的 Promise 对象。 |
 | getCesiumObject    | () => VcCesiumObject                    | 获取通过该组件加载的 Cesium 对象。          |
-| start              | () => void                              | 开始淹没分析。                              |
+| start              | (height?: number) => void               | 开始淹没分析。                              |
 | pause              | () => void                              | 暂停/继续淹没分析。                         |
 | stop               | () => void                              | 结束淹没分析。                              |
+| getCurrentHeight   | () => number                            | 获取当前拉伸高度。                          |