From f8b645f867b1653688d95d41c04f9f59718634c5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E6=89=BF?= <1141845963@qq.com>
Date: Mon, 24 Oct 2022 10:20:06 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=B7=BB=E5=8A=A0=E7=82=B9=E6=A0=87?=
 =?UTF-8?q?=E8=AE=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/Charts/Maps/MapAmap/config.ts    |  7 ++++---
 .../components/Charts/Maps/MapAmap/data.json    | 17 +++++++++++++++++
 .../components/Charts/Maps/MapAmap/index.vue    | 17 ++++++++++++++++-
 3 files changed, 37 insertions(+), 4 deletions(-)
 create mode 100644 src/packages/components/Charts/Maps/MapAmap/data.json

diff --git a/src/packages/components/Charts/Maps/MapAmap/config.ts b/src/packages/components/Charts/Maps/MapAmap/config.ts
index 18c56c23..6e80fb27 100644
--- a/src/packages/components/Charts/Maps/MapAmap/config.ts
+++ b/src/packages/components/Charts/Maps/MapAmap/config.ts
@@ -3,14 +3,15 @@ import { CreateComponentType } from '@/packages/index.d'
 import { MapAmapConfig } from './index'
 import { chartInitConfig } from '@/settings/designSetting'
 import cloneDeep from 'lodash/cloneDeep'
+import dataJson from './data.json'
 
 export const option = {
-  dataset: '',
+  dataset: dataJson,
   amapKey: 'aa76ad84f92f661980f710cbe966b7f6',
   amapStyleKey: 'normal',
   amapStyleKeyCustom: '',
-  amapLon: 116.39,
-  amapLat: 40.91,
+  amapLon: 116.397428,
+  amapLat: 39.90923,
   amapZindex: 10,
   viewMode: '2D',
   pitch: 60,
diff --git a/src/packages/components/Charts/Maps/MapAmap/data.json b/src/packages/components/Charts/Maps/MapAmap/data.json
new file mode 100644
index 00000000..8bb9d9a0
--- /dev/null
+++ b/src/packages/components/Charts/Maps/MapAmap/data.json
@@ -0,0 +1,17 @@
+{
+  "points": [
+    {
+      "icon": "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-1.png",
+      "position": [116.300467, 39.907761],
+      "title": "我是一个文本"
+    },
+    {
+      "icon": "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-2.png",
+      "position": [116.368904, 39.913423]
+    },
+    {
+      "icon": "//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-3.png",
+      "position": [116.305467, 39.807761]
+    }
+  ]
+}
diff --git a/src/packages/components/Charts/Maps/MapAmap/index.vue b/src/packages/components/Charts/Maps/MapAmap/index.vue
index b9d84973..a179d2d4 100644
--- a/src/packages/components/Charts/Maps/MapAmap/index.vue
+++ b/src/packages/components/Charts/Maps/MapAmap/index.vue
@@ -29,6 +29,7 @@ let {
 } = toRefs(props.chartConfig.option)
 
 let map = shallowRef(null)
+let markers = ref([])
 
 const ininMap = () => {
   AMapLoader.load({
@@ -46,7 +47,20 @@ const ininMap = () => {
         features: features.value,
         pitch: pitch.value, // 地图俯仰角度，有效范围 0 度- 83 度
         skyColor: skyColor.value,
-        viewMode: viewMode.value, // 地图模式
+        viewMode: viewMode.value // 地图模式
+      })
+      markers?.value.forEach((marker: any) => {
+        // 创建点实例
+        if (!/\d/.test(marker.icon || marker.position)) {
+          return
+        }
+        var marker = new AMap.Marker({
+          icon: marker?.icon,
+          position: [marker.position[0], marker.position[1]],
+          title: marker?.title,
+          offset: new AMap.Pixel(-13, -30)
+        })
+        marker.setMap(map)
       })
     })
     .catch(e => {})
@@ -55,6 +69,7 @@ const ininMap = () => {
 watch(
   () => props.chartConfig.option,
   newData => {
+    markers.value = newData.dataset.points
     ininMap()
   },
   { immediate: true, deep: true }