高德地图输入经纬度查询位置(根据经纬度导航的窍门)

前言

要说阿落在开发电商项目时,遇到头疼的问题之一,那就是根据地址信息获取经纬度。

在获取经纬度时,在项目中一般有两种处理方式。

一种是根据用户填写的详细地址,去调用高德地图的API获取经纬度,这种一般作用于用户收货地址,然后用收货地址来获取经纬度,用来匹配最近的仓库;

一种是在后台提供选择地址的功能,通过输入的地址或选取的地图的点获取经纬度,这种一般作用于仓库定位、线下商家定位等;

这篇文章,阿落要说的就是第二种,在页面中提供搜索地址或地图选点的方式获取经纬度。

1.实现目标

(1)输入地址,获取详细地址与经纬度

当在后台编辑时,在文本框输入完地址后,选择目标地址或需要的地址,自动获取该地址在地图中的详细地址字符串,以及该地址对应的经纬度;

图片1

(2)输入地址时对地址联想

一个地址名词,可能会有多处地方,当想不起来是在哪个区域时,就需要地图来帮助我们智能联想了。所以,当我们在文本框输入地址后,自动联想该地址关联的地址列表,供我们参考或选择。

图片2

2.代码实现

备注:前端框架使用的为LayUI

(1)Html代码

       

           

               

                   

                                           

               

           

           

                                           

                                                                           

           

                     

                               

                                   

               

                                   

               

                                   

           

           

                               

                                                                         

               

           

       

   

(2)JavaScript代码




4.结语

本篇内容就到这里了,对于获取经纬度,大家还有什么更好的建议或方式吗。