From e89dc9d0e7d5f680175ca8e6032e2c2f9a04f23b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E6=89=BF?= <1141845963@qq.com>
Date: Wed, 19 Oct 2022 10:21:48 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E9=AB=98=E5=BE=B7=E5=9C=B0=E5=9B=BE?=
 =?UTF-8?q?=E6=96=B0=E5=A2=9E=E5=B1=9E=E6=80=A7?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Charts/Maps/MapAmap/config.ts  |  3 ++
 .../components/Charts/Maps/MapAmap/config.vue | 33 +++++++++++++++++++
 .../components/Charts/Maps/MapAmap/index.vue  | 23 ++++++++++---
 3 files changed, 54 insertions(+), 5 deletions(-)

diff --git a/src/packages/components/Charts/Maps/MapAmap/config.ts b/src/packages/components/Charts/Maps/MapAmap/config.ts
index 5fdbd21c..18c56c23 100644
--- a/src/packages/components/Charts/Maps/MapAmap/config.ts
+++ b/src/packages/components/Charts/Maps/MapAmap/config.ts
@@ -12,6 +12,9 @@ export const option = {
   amapLon: 116.39,
   amapLat: 40.91,
   amapZindex: 10,
+  viewMode: '2D',
+  pitch: 60,
+  skyColor: '#53A9DE',
   lang: 'zh_cn',
   features: ['bg', 'point', 'road', 'building']
 }
diff --git a/src/packages/components/Charts/Maps/MapAmap/config.vue b/src/packages/components/Charts/Maps/MapAmap/config.vue
index 76f419d6..cb984ec7 100644
--- a/src/packages/components/Charts/Maps/MapAmap/config.vue
+++ b/src/packages/components/Charts/Maps/MapAmap/config.vue
@@ -44,6 +44,29 @@
         <n-input-number v-model:value="optionData.amapZindex" size="small"></n-input-number>
       </setting-item>
     </setting-item-box>
+    <setting-item-box name="展示模式" :alone="true">
+      <setting-item>
+        <n-radio-group v-model:value="optionData.viewMode" name="radiogroup">
+          <n-space>
+            <n-radio v-for="song in viewModeOptions" :key="song.value" :value="song.value">
+              {{ song.label }}
+            </n-radio>
+          </n-space>
+        </n-radio-group>
+      </setting-item>
+    </setting-item-box>
+    <template v-if="optionData.viewMode === '3D'">
+      <setting-item-box name="天空色" :alone="true">
+        <setting-item>
+          <n-color-picker size="small" :modes="['hex']" v-model:value="optionData.skyColor"></n-color-picker>
+        </setting-item>
+      </setting-item-box>
+      <setting-item-box name="俯仰角" :alone="true">
+        <setting-item>
+          <n-input-number v-model:value="optionData.pitch" :min="0" :max="83" size="small"></n-input-number>
+        </setting-item>
+      </setting-item-box>
+    </template>
   </collapse-item>
 </template>
 
@@ -71,6 +94,16 @@ const langOptions = ref([
     label: '中英文对照'
   }
 ])
+const viewModeOptions = ref([
+  {
+    value: '2D',
+    label: '2D'
+  },
+  {
+    value: '3D',
+    label: '3D'
+  }
+])
 const featuresOptions = ref([
   {
     value: 'bg',
diff --git a/src/packages/components/Charts/Maps/MapAmap/index.vue b/src/packages/components/Charts/Maps/MapAmap/index.vue
index 9d947309..b9d84973 100644
--- a/src/packages/components/Charts/Maps/MapAmap/index.vue
+++ b/src/packages/components/Charts/Maps/MapAmap/index.vue
@@ -14,16 +14,26 @@ const props = defineProps({
     required: true
   }
 })
-let { amapKey, amapStyleKey, amapLon, amapLat, amapZindex, lang, amapStyleKeyCustom, features } = toRefs(
-  props.chartConfig.option
-)
+let {
+  amapKey,
+  amapStyleKey,
+  amapLon,
+  amapLat,
+  amapZindex,
+  lang,
+  amapStyleKeyCustom,
+  features,
+  viewMode,
+  pitch,
+  skyColor
+} = toRefs(props.chartConfig.option)
 
 let map = shallowRef(null)
 
 const ininMap = () => {
   AMapLoader.load({
     key: amapKey.value, //api服务key--另外需要在public中使用安全密钥！！！
-    version: '1.4.4', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+    version: '1.4.8', // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
     plugins: ['AMap.PlaceSearch', 'AMap.AutoComplete'] // 需要使用的的插件列表
   })
     .then(AMap => {
@@ -33,7 +43,10 @@ const ininMap = () => {
         center: [amapLon.value, amapLat.value],
         mapStyle: `amap://styles/${amapStyleKeyCustom.value !== '' ? amapStyleKeyCustom.value : amapStyleKey.value}`, //自定义地图的显示样式
         lang: lang.value,
-        features: features.value
+        features: features.value,
+        pitch: pitch.value, // 地图俯仰角度，有效范围 0 度- 83 度
+        skyColor: skyColor.value,
+        viewMode: viewMode.value, // 地图模式
       })
     })
     .catch(e => {})