vue 高德地图标记_如何在vue里面调用高德地图

1.修改webpac.base.conf.js文件

与module同一级添加

externals: {

‘AMap‘: ‘AMap‘,

‘AMapUI‘: ‘AMapUI‘

}配置。

然后在index页面引入文件

接着下载包vue-amap，

然后在vue页面中

import AMap from ‘AMap‘//在使用地图的页面引入该组件

var map

export default {

mounted: function () {

this.init()

},

methods: {

init: function () {

map = new AMap.Map(‘container‘, {

center: [116.34301260000001, 39.9662898],

resizeEnable: true,

zoom: 10

})

//创建一个marker

var marker = new AMap.Marker({//在地图上显示自己的位置标记

position: [116.34301260000001, 39.9662898],//marker所在的位置

map:map//创建时直接赋予map属性

});

AMap.plugin([‘AMap.ToolBar‘, ‘AMap.Scale‘], function () {

map.addControl(new AMap.ToolBar())

map.addControl(new AMap.Scale())

})

}

}

}

这样基本的地图调用就OK啦

原文：http://www.cnblogs.com/wb336035888/p/7419699.html