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

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

创作背景

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

相关技术

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

1. key的申请 ：开发者需要先去高德地图的官网申请一个应用key，然后才能够正常使用。申请地址
2. 官网demo：查看官网给的相关demo。官网demo
3. 在官网给的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 <T>
 */
public class Result<T> {
    // 轨迹线名称
    private String name;
    // 轨迹线数组
    private List<T> path;
    public Result() {
    }
    public Result(String name, List<T> path) {
        this.name = name;
        this.path = path;
    }
    public String getName() {
        return name;
    }
    public void setName(String name) {
        this.name = name;
    }
   public List<T> getPath() {
        return path;
    }
    public void setPath(List<T> path) {
        this.path = path;
    }
}

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

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

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

实现效果

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

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