百度地图入门教程

zhangxiaobai___

已于 2022-10-31 19:23:03 修改

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

文章标签： vue.js javascript 前端百度前端框架

于 2022-10-31 19:20:24 首次发布

本文链接：https://blog.csdn.net/zhangxiaobai___/article/details/127620804

本文详细介绍了如何在HTML和Vue.js项目中集成并使用百度地图，包括获取密钥、引入JS、创建地图容器、初始化地图、添加地图控制器、绘制点线面、创建信息窗口以及实现地图搜索等功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

百度地图官方网站 https://lbs.baidu.com/，LBS：locationBusinessServer 基于定义位置的商业服务。百度地图提供七大功能与服务：定位、地图、轨迹、路线规划、导航、路况、搜索等。本文主要介绍在HTML及vue中如何导入并使用百度地图。

一、使用步骤

1.1登录注册，获取密钥(AK)

进入https://lbs.baidu.com/，注册帐号，注意以开发者身份注册，需要实名制。注册以后，就是获取密钥了。首页-->控制台-->应用管理-->我的应用-->创建应用，如下图：

点击提交后，就可以获取AK，点击复制。

1.2 引入百度地图js

创建一个html文档，引入js

<script type="text/javascript" src="https://api.map.baidu.com/api?v=1.0&&type=webgl&ak=L1YGW8qk0fHKxneUYjLLxq8GlOZv5xau">
//L1YGW8qk0f