web开发 基于高德JS服务API的使用demo 包括 景点推荐 附近周边搜索 路线规划 定位服务等功能的综合使用

本文分享了作者初次接触地图API的经验,详细介绍了选择高德地图API的理由及其实用指南。涵盖地图JSAPI、web服务API和URIAPI的使用场景,以及定位服务、自动输入提示和路线规划等功能的实现细节。

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

文章目录

选择

  • 平台选择

最近接触到一个比赛项目 要做类似于 旅游路线和景点推荐的地图 出于第一次接触, 立刻向度娘求助 求助当前各地平台的API 的使用, 最终敲定了高德地图 理由很简单 当前所有API教程中高德无疑上手难度最小

  • API选择
    在这里插入图片描述刚开始在官网繁多的API的选择上 我有点不知所措, 后来经过笔者的验证 初学者 只需要上面我标注的三个接口即可 (我说的是web端开发需求)

    • 地图 JS API
      基本必用, 这里面包含了所有你可能用的基本功能demo,它更侧重于地图服务相关功能的展示, 以及样例代码的提供

    • web服务API
      纯接口形式, 即就是上面地图 JS API的所使用的API接口调用介绍, 它可以为你的应用提供更灵活的设计 比如你对上面API请求的地图的数据 需要自定义结果实现时, 可以自己手动传参并接收结果.

    • URI API
      快速开发, 它时完全基于URI的形式服务, 如果你的平台不需要自己植入地图, 而是仅仅需要使用地图某些功能 直接用它你会非常的舒服, 几乎不需要多少前端代码

注:这三种API提供的服务从功能上完全一致, 仅仅是使用场景的需求差异,


使用

注:
1.这里我就不再啰嗦原理, 官网都说的很明白, 我这里只展示相关功能截图 以及误区介绍
2.样例代码 需要手动关注后 联系我我会直接发给你

误区介绍
1.定位服务测试最好先去IE测试, 基本都是没问题, 而Chrome失败率极高, 目前暂时找不到愿意

在这里插入图片描述

在这里插入图片描述

通过键盘响应直接获得相关输入提示, 同时选中某条记录后进行对目标数据搜索景点信息 这里我自定义了展示演示

在这里插入图片描述
在这里插入图片描述

值得一提的是 这个我是根据高德自定义样式实现, 同时为了扩展需要 还添加了几种交通出行方式, 其中自驾 公交 自行车数据来源于高德, 火车 飞机数据 来源第三方付费API


结语

地图API繁多而杂, 建议初学者 不要全部文档都看 而是着重根据你的意图 去看相关文档 这样会省事很多.

评论 12
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值