feat: prism 支持visible属性

yue1123 · Jun 19, 2023 · 0d5cbad · 0d5cbad
1 parent c1ff306
commit 0d5cbad
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 12 deletions.
diff --git a/docs/zh-CN/components/overlay/prism.md b/docs/zh-CN/components/overlay/prism.md
@@ -22,15 +22,16 @@ overlay/prism
 
 ## 动态组件 Props
 
-| 属性            | 说明                                        | 类型                            | 可选值 | 默认值     |
-| --------------- | ------------------------------------------- | ------------------------------- | ------ | ---------- |
-| path            | 多边形的坐标数组                            | `{ lng: number, lat: number}[]` | -      | `required` |
-| altitude        | 3d 棱柱高度                                 | `number`                        | -      | `required` |
-| topFillColor    | 顶面填充颜色                                | `string `                       | -      | `#fff`     |
-| topFillOpacity  | 顶面填充颜色透明度                          | `number`                        | `0-1`  | -          |
-| sideFillColor   | 侧面填充颜色                                | `string`                        | -      |            |
-| sideFillOpacity | 侧面填充颜色透明度                          | `number`                        | `0-1`  | `#fff`     |
-| enableMassClear | 是否在调用 `map.clearOverlays` 清除此覆盖物 | `boolean`                       | -      | ` true`    |
+| 属性            | 说明                                        | 类型                            | 可选值 | 默认值     | 版本                               |
+| --------------- | ------------------------------------------- | ------------------------------- | ------ | ---------- | ---------------------------------- |
+| path            | 多边形的坐标数组                            | `{ lng: number, lat: number}[]` | -      | `required` | -                                  |
+| altitude        | 3d 棱柱高度                                 | `number`                        | -      | `required` | -                                  |
+| topFillColor    | 顶面填充颜色                                | `string `                       | -      | `#fff`     | -                                  |
+| topFillOpacity  | 顶面填充颜色透明度                          | `number`                        | `0-1`  | -          | -                                  |
+| sideFillColor   | 侧面填充颜色                                | `string`                        | -      |            | -                                  |
+| sideFillOpacity | 侧面填充颜色透明度                          | `number`                        | `0-1`  | `#fff`     | -                                  |
+| enableMassClear | 是否在调用 `map.clearOverlays` 清除此覆盖物 | `boolean`                       | -      | ` true`    | -                                  |
+| visible         | 是否显示                                    | `boolean`                       | -      | `true`     | <Badge type="tip" text="^2.1.4" /> |
 
 ## 组件事件
 

diff --git a/packages/components/overlay/prism/index.vue b/packages/components/overlay/prism/index.vue
@@ -48,6 +48,10 @@
      * 是否在调用map.clearOverlays清除此覆盖物，默认为true
      */
     enableMassClear?: boolean
+    /**
+     * 是否可见
+     */
+    visible?: boolean
     onClick?: Callback
     onDblclick?: Callback
     onMousedown?: Callback
@@ -63,7 +67,8 @@
     sideFillColor: '#fff',
     sideFillOpacity: 0.8,
     enableMassClear: true,
-    autoCenter: true
+    autoCenter: true,
+    visible: true
   })
   const vueEmits = defineEmits([
     'initd',
@@ -98,7 +103,8 @@
         topFillOpacity,
         sideFillColor,
         sideFillOpacity,
-        enableMassClear
+        enableMassClear,
+        visible
       } = props
       const pathPoints = isBoundary ? (path as string[]) : pathPointsToMapPoints(path as Point[])
       prism = new BMapGL.Prism(pathPoints, altitude, {
@@ -108,7 +114,7 @@
         sideFillOpacity,
         enableMassClear
       })
-      map.addOverlay(prism)
+      visible && map.addOverlay(prism)
       bindEvents(props, vueEmits, prism)
       ready(map, prism)
       syncMapCenter()
@@ -130,6 +136,12 @@
         deep: true
       }
     )
+    watch(
+      () => props.visible,
+      (n) => {
+        map[n ? 'addOverlay' : 'removeOverlay'](prism)
+      }
+    )
     return clear
   })