vue 引入高德地图的，2种引入方式

（1）.如果引入组件：vue-amap，需要安装依赖。npm install vue-amap

然后在main里面配置：

import VueAMap from 'vue-amap' // 高德地图

Vue.use(VueAMap)

VueAMap.initAMapApiLoader({

  key: '83ed397b509e23519432601e51123ffe',

  plugin: [

    'AMap.Autocomplete', // 输入提示插件

    'AMap.PlaceSearch', // POI搜索插件

    'AMap.Scale', // 右下角缩略图插件 比例尺

    'AMap.OverView', // 地图鹰眼插件

    'AMap.ToolBar', // 地图工具条

    'AMap.MapType', // 类别切换控件，实现默认图层与卫星图、实施交通图层之间切换的控制

    'AMap.PolyEditor', // 编辑 折线多，边形

    'AMap.CircleEditor', // 圆形编辑器插件

    'AMap.Geolocation' // 定位控件，用来获取和展示用户主机所在的经纬度位置

  ],

  v: '1.4.4'

})

此时全局配置已经配置好，vue页面或者组件就可以使用了

不用创建：

marker = new AMap.Marker({ }）可以直接用了

（2）.原生高德地图引用：

在index.html中引入

 <script src="https://webapi.amap.com/maps?v=1.4.15&key=83ed397b509e23519432601e51123ffe"></script>

此时全局配置已经配置好，vue页面或者组件就可以使用了

创建地图：

map=''

map = new AMap.Map('amap2', {

        resizeEnable: true,

        center: [116.403322, 39.900255], // 地图中心点

        zoom: 13 // 地图显示的缩放级别

      })