位置: IT常识 - 正文
Vue项目使用百度地图api(vue项目使用百度地图怎么长久使用)
编辑：rootadminVue项目使用百度地图api
1.百度开发者认证
本文链接地址:https://www.jiuchutong.com/zhishi/298872.html
转载请保留说明！
目录
1.百度开发者认证
2.创建应用
3.引用百度地图API文件
4.展示地图
1.百度开发者认证
推荐整理分享Vue项目使用百度地图api(vue项目使用百度地图怎么长久使用)，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:vue项目百度收录,vue项目使用rem,vue项目使用百度地图怎么长久使用,vue项目百度定位,vue项目百度网盘,vue项目使用百度地图实现降雨量云图,vue项目使用百度离线地图,vue项目使用百度地图怎么长久使用,内容如对您有帮助，希望把文章链接给更多的朋友！
进入百度地图开放平台 官网，（认证需要身份证号码，人脸识别，手机百度APP，邮箱地址）
注册登录完成，在控制台可以进行开发者认证。
2.创建应用在应用管理中可以创建应用，应用类型需要选择浏览器端，Referer白名单如果只是测试版本，可以先使用*，只有该白名单中的网站才能成功发起调用。
创建完成就会生成一个AK。
3.引用百度地图API文件在JavaScript开放文档中有教程，可以根据教程来引用。
如果我们要在vue中使用，我们需要将这代码段放到html文件中。
<script type="text/javascript" src="https://api.map.baidu.com/api?v=3.0&&type=webgl&ak=您的密钥"></script>需要修改里面的ak值，就是上面创建应用生成的ak值。
4.展示地图展示地图也有一个demo可供学习。
如果在vue中的index.html中引入api之后，在项目中就可以使用了。
var map = new BMapGL.Map("container"); // 创建地图实例var point = new BMapGL.Point(116.404, 39.915); // 创建点坐标 map.centerAndZoom(point, 15); // 初始化地图，设置中心点坐标和地图级别这是使用的案例，有几个需要注意的事项：
要把这段代码放到Mounted生命周期里面；要拿到展示地图的那个实例，可以用ref拿到；设置展示地图的实例的宽高；创建点坐标可以修改。
至此，简单使用百度地图API已经完成了。
上一篇：yoloV5-face学习笔记(yolo v5训练)
下一篇：深入理解CSS之flex精要之 flex-basis flex-grow flex-shrink 实战讲解(css详解)
