高德地图输入经纬度查询位置(根据经纬度导航的窍门)
前言
要说阿落在开发电商项目时,遇到头疼的问题之一,那就是根据地址信息获取经纬度。
在获取经纬度时,在项目中一般有两种处理方式。
一种是根据用户填写的详细地址,去调用高德地图的API获取经纬度,这种一般作用于用户收货地址,然后用收货地址来获取经纬度,用来匹配最近的仓库;
一种是在后台提供选择地址的功能,通过输入的地址或选取的地图的点获取经纬度,这种一般作用于仓库定位、线下商家定位等;
这篇文章,阿落要说的就是第二种,在页面中提供搜索地址或地图选点的方式获取经纬度。
1.实现目标
(1)输入地址,获取详细地址与经纬度
当在后台编辑时,在文本框输入完地址后,选择目标地址或需要的地址,自动获取该地址在地图中的详细地址字符串,以及该地址对应的经纬度;
图片1
(2)输入地址时对地址联想
一个地址名词,可能会有多处地方,当想不起来是在哪个区域时,就需要地图来帮助我们智能联想了。所以,当我们在文本框输入地址后,自动联想该地址关联的地址列表,供我们参考或选择。
图片2
2.代码实现
备注:前端框架使用的为LayUI
(1)Html代码
rW。haO22.COM
rW。haO22.COM
保存
rW。haO22.COM 详细地址
* 省市区
请选择
* 输入地址
(2)JavaScript代码
");
infoWindow.open(map, marker.getPosition());
// map.setCenter(marker.getPosition());
});
poiPicker.onCityReady(function() {
// poiPicker.suggest("");
marker.setMap(map);
infoWindow.setMap(map);
infoWindow.setContent("详细信息: "+""+""); infoWindow.open(map); }); } })
4.结语
本篇内容就到这里了,对于获取经纬度,大家还有什么更好的建议或方式吗。
.CHP57 { display:none; }
评论