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

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

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

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • C/C++常见面试知识点总结附面试真题—-20220326更新

    C/C++常见面试知识点总结附面试真题—-20220326更新以下内容部分整理自网络,部分为自己面试的真题。第一部分:计算机基础1.C/C++内存有哪几种类型?C中,内存分为5个区:堆(malloc)、栈(如局部变量、函数参数)、程序代码区(存放二进制代码)、全局/静态存储区(全局变量、static变量)和常量存储区(常量)。此外,C++中有自由存储区(new)一说。2.堆和栈的区别?1).堆存放动态分配的对象——即那些在程序运行时分配的对象…

    2022年7月15日
    23
  • 给织梦DEDECMS添加栏目图片与英文名显示

    给织梦DEDECMS添加栏目图片与英文名显示

    2021年9月24日
    53
  • 排序算法:桶排序、计数排序、基数排序

    排序算法:桶排序、计数排序、基数排序

    2021年10月5日
    39
  • 面试官都震惊,你这网络基础可以啊![通俗易懂]

    面试官都震惊,你这网络基础可以啊![通俗易懂]目录网络1.对网络的基础认识<1>.组网方式<2>.OSI七层模型<3>.TCP/IP五层(四层模型)<4>.对封装分用的理解2.网络数据传输<1>局域网(1)认识IP和MAC(2)网络数据传输的特性(3)网络数据传输流程1)网络互联的方式2).局域网交换机组网的方式3)局域网交换机+路由器组网的方式<2>广域网传输流程3.UDP和TCP<1>UDP协议<2>TCP协议(可靠的传输协议)(1)TCP相关概念(2)

    2022年4月20日
    421
  • DOS命令大全_黑客cmd命令大全

    DOS命令大全_黑客cmd命令大全Windows命令Net命令IO命令IIS服务命令FTP命令MYSQL命令Linux命令要区分大小写计算机运行命令全集

    2022年8月4日
    7
  • 修改ntp服务器地址,修改ntp服务器地址

    修改ntp服务器地址,修改ntp服务器地址修改ntp服务器地址内容精选换一换修改子网名称、DNS服务器地址等。当前在部分区域中,子网已从虚拟私有云中解耦,解耦后子网拥有独立入口。未解耦:在虚拟私有云详情页的“子网”页签,可对子网进行操作。本小节的操作步骤指导以此入口为例。已解耦:在进入“网络>虚拟私有云”后,在左侧导航栏直接选择“子网”,可对子网进行操作。登录管理控制台。在管理控制台左上角单击,选择区域和项目网关创建成功以后,…

    2022年6月14日
    30

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

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