在日常生活中，地图的应用很广泛，那么作为前端小白，怎么样才能调用地图模块呢？
以百度地图为例：
1：首先打开百度地图开放平台网站百度地图开放平台 | 百度地图API SDK | 地图开发 (baidu.com)
文章图片
https://lbsyun.baidu.com/
2：注册一个个人开发者账号。创建好后点击控制台，找到应用管理--我的应用，新建一个应用
3：新建一个html，在页面中先导入百度地图，具体步骤如下图
文章图片
【前端|js和vue如何调用百度地图】 页面效果如下
文章图片
那怎么给地图的某个地点做一个标记呢？
文章图片
文章图片
上述代码可以实现在地图上单击创建一个标记，再单击会取消上一个标记在这次点击的左边位置新建一个标记，双击会把之前单价创建的标记创建一个面
页面效果如下
接下来我们要实现搜索功能，在文本框里输入文字，然后地图把输入的东西检索并在地图上标记出来，这个功能需要jQuery.js的Ajax请求，因为要请求百度地图的检索功能api
文章图片
文章图片
文章图片
页面效果
那么如何在vue项目中调用呢？
只需要在public目录下的index.html中引入百度地图接口
文章图片
然后就可以在页面中使用啦！
文章图片
启动项目，看下效果
文章图片
以上就是 调用百度地图的步骤了，如有疑问可在下面评论必会答疑解惑
推荐阅读
- Typescript 学习笔记
- Webpack|一份不可多得的 Webpack 学习指南（共10k字）
- 开发工具|小马带你认识前端开发神器WebStorm（WebStorm及Git的相关配置与使用）
- 简单响应式的实现（1）
- JavaScript中集合引用类型就这么点东西
- Web 性能权威指南
- 前端高效开发必备的 js 库
- 前端工程师经常上哪些网站学习最新技术?
- 融合通信常见问题3月刊 | 云信小课堂