mapbox 导航_5 分钟掌握如何用 Mapbox Android SDK 制作导航 App(上) | 附源码

97448629152c3577b0e4806937a0e784.png

da8f7d0cce48b9e379bf795716d85b58.png


如今,许多应用程序都具有定位功能,比如叫个外卖啊,打个车啊,甚至洗个衣服都能用到 App,在这类应用中,地图自然是不可缺少的;除此之外,越来越多的 App 开发者都在思考如何在应用中结合位置服务,挖掘更深层次的用户场景。
但是,听起来给 App 加地图,那些英文文档,接口,API...简直太复杂了。
别担心!本文将会帮你摆脱种种顾虑,通过一个开源案例 Where2Go,让你入门 Mapbox SDK,并快速构建一个具有位置功能的炫酷 Android 应用。

3d65e0a67b6aef6b9a293425081bdef9.png


你将会了解到下面的内容:

  • 如何在工程中添加 Mapbox 库
  • 在地图上展示使用者目前的位置
  • 在地图上添加标记,并实现从当前位置到标记位置的导航功能

先行知识
本教程假设您了解使用 Kotlin 进行 Android 开发的基础知识。
如果您是 Android 开发的新手,请通过 Kotlin 的 Beginning Android Development 了解基础知识。
如果您是 Kotlin 的新手,请查看 Introduction to Kotlin 教程。

材料下载和 Android 环境配置
在了解 Mapbox 之前,请您先下载好入门材料和最终项目,具体下载方法是:扫描下方二维码或关注公众号Mapbox(Mapbox_China)并回复「技术」

b3128956f0632da951235dd5b541220d.png


启动 Android Studio 3.3 或更高版本,选择 Open an existing Android Studio project 选项,然后选择刚才下载好的项目文件夹并启动。

8c2dd3dd4bb0637e1b3580262e21f932.png


当 Gradle 加载完成后,你可以直接运行一下,将会在模拟器中看到这样的画面。

c0c70ef11a906947b7b5e89e91ff91b9.png


这是空的,因为还没添加地图。下面就看看如何添加地图。 注册 Mapbox 账户
在使用 Mapbox SDK 之前,您需要做的第一件事是注册一个帐户。然后,一旦您成功注册,您将获得访问令牌(Access Token)。此令牌是您使用 Mapbox SDK 所需的密钥。

注册地址
到达 Mapbox 网站后,单击红色箭头指示的登录按钮。

bc14242ed63955df5c663e3eefa0f85f.png


您将被定向到另一个具有登录形式的页面,单击注册Mapbox,如红色框中所示。

8fe06fe242c5c932e6e2ca8921a2ea2a.png


在注册界面填写自己的信息后,点击 Get started。

  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要使用Mapbox GL JS进行导航,你需要先引入Mapbox GL JS库,并且拥有一个Mapbox账号,然后可以在你的项目中使用Mapbox获得的Access Token。可以通过以下方式引入Mapbox GL JS库: ```html <!-- 引入Mapbox GL JS库 --> <script src='https://api.mapbox.com/mapbox-gl-js/v1.9.1/mapbox-gl.js'></script> <link href='https://api.mapbox.com/mapbox-gl-js/v1.9.1/mapbox-gl.css' rel='stylesheet' /> ``` 接下来,你可以使用Mapbox GL JS的API来创建地图,并设置地图的中心点和缩放级别。示例代码如下: ```javascript const map = new mapboxgl.Map({ container: container, // 指定地图容器的ID或HTMLElement style: 'mapbox://styles/mapbox/streets-v11', // 指定地图样式 center: start, // 指定地图中心点的经纬度 zoom: 13 // 指定地图的缩放级别 }); ``` 然后,你可以使用Mapbox Directions API获取从起点到终点的路径信息,并使用Mapbox GL JS的API在地图上绘制路径。具体的路径绘制方法可以根据你的需求来选择适合的API。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [如何用mapboxgl实现路径导航,帮我书写一下代码](https://blog.csdn.net/weixin_35755434/article/details/128873734)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值