高德地图及其高德相关UI库的使用

注意:**安全密钥设置之后再加载地图**
https://lbs.amap.com/api/javascript-api-v2/guide/abc/jscode

在2021年12月02日以后申请的key需要配合您的安全密钥一起使用。且安全密钥需设置在key之前

```javascript

```


引入高德地图的方式:
   https://lbs.amap.com/api/javascript-api-v2/getting-started

1:script标签引入
2:npm 引入

对于的,当我们需要使用到地图的一些特殊功能的时候,如拖拽

那么需要结合AmapUi组件库去实现
 Amap UI组件库 的引入方式
1:若map引入是通过script的方式引入的,
那么 amap的引入也需要通过script的方式引入

引入方式:https://lbs.amap.com/api/amap-ui/intro
注意:异步的引入方式 一定要注意初始化部分  异步引入initAMapUI()必不可少

```javascript







npm 方式引入:

//map通过npm 安装使用
import AMapLoader from "@amap/amap-jsapi-loader";
Vue.use(AMapLoader);

AMapan安装与使用
import VueAMap from 'vue-amap'
Vue.use(VueAMap)

VueAMap.initAMapApiLoader({
	key: '您申请的key值',
	plugin: ['AMap.Scale', 'AMap.OverView', 'AMap.ToolBar', 'AMap.MapType', 'AMap.PlaceSearch',
		'AMap.Geolocation', 'AMap.Geocoder'
	],
	v: '1.4.4',
	uiVersion: '1.0'
})


你可能感兴趣的:(ui,arcgis,高德地图)