如何在vue中引入百度地图

1.进入百度地图开放平台官网,进行实名认证 

   https://lbsyun.baidu.com/

如何在vue中引入百度地图_第1张图片

2. 完成实名认证后,进入控制台如何在vue中引入百度地图_第2张图片

3.进入应用管理 ===> 我的应用 ===> 创建应用

如何在vue中引入百度地图_第3张图片

4. 根据应用场景更改应用类型

如何在vue中引入百度地图_第4张图片 

5. 白名单填写 ' * ' ===>提交

如何在vue中引入百度地图_第5张图片

6.这样就拥有了你的第一个AK

 

 

7.进入Vue Baidu Map官网使用手册 

Vue Baidu Map 

如何在vue中引入百度地图_第6张图片 

8.在项目中下载包  npm i vue-baidu-map --save

 如何在vue中引入百度地图_第7张图片

9.使用全局注册 封装组件 

如何在vue中引入百度地图_第8张图片 

10. 去除百度地图水印

::v-deep .anchorBL{

display: none ;

}

11.地图方法归类 百度地图JSAPI 2.0类参考

如何在vue中引入百度地图_第9张图片

 这样你就拥有了自己的百度地图辣!(可以通过回调函数中的经纬度定位)

如何在vue中引入百度地图_第10张图片

 

你可能感兴趣的:(vue.js,前端,javascript)