vue 高德地图标记_如何在vue里面调用高德地图「建议收藏」

vue 高德地图标记_如何在vue里面调用高德地图「建议收藏」1.修改webpac.base.conf.js文件与module同一级添加externals:{‘AMap‘:‘AMap‘,‘AMapUI‘:‘AMapUI‘}配置。然后在index页面引入文件接着下载包vue-amap,然后在vue页面中importAMapfrom‘AMap‘//在使用地图的页面引入该组件varmapexportdefault{mounted:functio…

大家好,又见面了,我是你们的朋友全栈君。

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

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/143310.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号