使用高德地图API实现历史轨迹查询

2024-07-17 03:50| 来源: 网络整理| 查看: 265

欢迎大家关注我的公众号，有问题可以及时和我交流。

使用高德地图API完成历史轨迹查询创作背景相关技术设计思路实现难点编码实现实现效果

创作背景

因为对历史轨迹查询比较好奇，所以使用高德地图API简单完成了一个历史轨迹查询的功能。由于初学者，程序或者教程如有存在不恰当之初请大家多多指点，我一定及时更改。

相关技术

项目是基于WEB端实现的，后台使用了SpringBoot，前台使用了layui框架搭建一个简单的页面。

key的申请：开发者需要先去高德地图的官网申请一个应用key，然后才能够正常使用。申请地址官网demo：查看官网给的相关demo。官网demo在官网给的demo中可以动态的修改数据就可以刷新历史轨迹。主要数据

设计思路

用过后台获取数据格式化成规定JSON数据之后返回给前台就可以实现简单的历史轨迹查询。

实现难点

通过观察上述图片可以看实现历史轨迹到使用的是 **pathSimplifierIns.setData()**的方法。也就是说，通过ajax请求调用之后返回给一个正确的JSON给它即可。格式为：

{ "name": "路线0", "path": [ [116.405289, 39.904987], [113.964458, 40.54664], [111.47836, 41.135964], [108.949297, 41.670904], [106.380111, 42.149509], [103.774185, 42.56996], [101.135432, 42.930601], [98.46826, 43.229964], [95.777529, 43.466798], [93.068486, 43.64009], [90.34669, 43.749086], [87.61792, 43.793308] ] }

于是我们可以仿照上述的JSON格式自己设计一个相应数据的JSON体。

编码实现

1.设置响应体，编码如下：

/** * 设置轨迹路径的相应实体 bean * @param */ public class Result { // 轨迹线名称 private String name; // 轨迹线数组 private List path; public Result() { } public Result(String name, List path) { this.name = name; this.path = path; } public String getName() { return name; } public void setName(String name) { this.name = name; } public List getPath() { return path; } public void setPath(List path) { this.path = path; } }

2.请求数据（这里给出了集合里面的设置方法 BaseGps 为从数据库查询出来的集合，可以自己进行模拟设置）。

// 定义一个集合存储基本数据集合 List lists = new ArrayList(); // 遍历查询出来的集合 for (BaseGps baseGps : baseGpsList) { // 定义一个集合存储经纬度数据 List LngAndLatList = new ArrayList(); // 设置经度 LngAndLatList.add(baseGps.getLng()); // 设置维度 LngAndLatList.add(baseGps.getLat()); // 存放入集合中 lists.add(LngAndLatList); } Result result = new Result(); // 设置路线名称 result.setName("我的历史轨迹路线"); // 设置路线数据集合 result.setPath(lists);

最后把result返回给前端即可。

实现效果

历史轨迹效果实现这里仅仅简单的介绍了基本的实现思路，如果有更好的请多多指点，因为，此程序设计到其他内容，如果需要源码请与我联系，大家一块交流进步。

欢迎大家关注我的公众号，有问题可以及时和我交流。

【本文地址】

公司简介

联系我们