AMap1.vue 是高德地图(@amap/amap-jsapi-loader) demo, 由于需要 key, 暂时未使用

src/views/home/AMap1.vue

@@ -0,0 +1,51 @@
+<template>
+  <div id="container"></div>
+</template>
+
+<script>
+import AMapLoader from '@amap/amap-jsapi-loader';
+import { shallowRef } from '@vue/reactivity'
+
+export default {
+  data () {
+    return {
+    }
+  },
+  mounted(){
+    //DOM初始化完成进行地图初始化
+    this.initMap();
+  },
+  setup(){
+    const map = shallowRef(null);
+    return{
+      map,
+    }
+  },
+  methods:{
+    initMap(){
+      AMapLoader.load({
+        key:"",             // 申请好的Web端开发者Key，首次调用 load 时必填
+        version:"2.0",      // 指定要加载的 JSAPI 的版本，缺省时默认为 1.4.15
+        plugins:[''],       // 需要使用的的插件列表，如比例尺'AMap.Scale'等
+      }).then((AMap)=>{
+        this.map = new AMap.Map("container",{  //设置地图容器id
+          viewMode:"3D",    //是否为3D地图模式
+          zoom:5,           //初始化地图级别
+          center:[105.602725,37.076636], //初始化地图中心点位置
+        });
+      }).catch(e=>{
+        console.log(e);
+      })
+    },
+  }
+}
+</script>
+
+<style>
+#container{
+  padding:0px;
+  margin: 0px;
+  width: 100%;
+  height: 800px;
+}
+</style>