vue-element-admin使用百度地图

最新推荐文章于 2022-12-10 16:58:33 发布

时闻折竹

最新推荐文章于 2022-12-10 16:58:33 发布

阅读量2k

点赞数 3

CC 4.0 BY-SA版权

分类专栏：小程序文章标签： javascript vue.js elementui

本文链接：https://blog.youkuaiyun.com/ZeroSwift/article/details/124237206

这篇博客介绍了如何在vue-element-admin项目中集成百度地图，包括获取百度地图API Key，将必要的JS文件放入Public文件夹，以及创建一个可以响应用户交互的Vue组件来展示地图并添加标记。

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

文章目录

获取百度地图的Key
设置Public
将mapv.min.js和common.js放入Public文件夹
测试调用

获取百度地图的Key

进入百度地图开放平台
进入控制台，并进行应用的创建

设置Public

获得百度地图的key之后，打开vue-element-admin中的Public的index.html源文件，并在其中添加以四行。其中，ak后面的xxxxxxxxx指的是你的百度地图的key

<script src="https://api.map.baidu.com/api?v=1.0&type=webgl&ak=xxxxxxxxx"></script>
<script src="./mapv.min.js"></script>
<script src="./common.js"></script>
<script src="https://code.bdstatic.com/npm/mapvgl@1.0.0-beta.119/dist/mapvgl.min.js"></script>