您的位置:首页 > Web前端 > JavaScript

百度地图根据省市县定位,经纬度和地址信息互相转化JS示例

2017-04-14 20:12 417 查看


如上如所示,当输入好对应的省市县区之后,当输入定位地址时,下面地图会根据你输入的内容进行定位;下面要展示的代码亦可以根据你的需求直接根据输入的省市县区名字来进行定位,自己根据需求进行处理即可;

<script>
// 百度地图API功能
var map = new BMap.Map("allmap");
var point, marker, m_address;

initMap(new BMap.Point('{$shop.lng}', '{$shop.lat}'));

//初始化地图
function initMap(init_point)
{
point = init_point;
map.centerAndZoom(point, 18);//地图显示
marker = new BMap.Marker(point);//创建标注
map.addOverlay(marker);
map.enableScrollWheelZoom(); //可以鼠标滚动、缩放比例尺
marker.enableDragging(); //可拖拽
//拖曳标注点的位置
marker.addEventListener("dragend", function(e){
point = marker.getPosition();//获取marker的位置
reset_location();
});
}

//实时定位
function set_location()
{
var province = $("input[name='province']").val();
var city = $("input[name='city']").val();
var county = $("input[name='county']").val();
var street = $("input[name='street']").val();

if (province=='' || city=='' || county=='')
{
$("input[name='street']").val('');
alert('请先选择完整省、市、县/区');
return false;
}

m_address = province + city + county + street;
set_place();
}

//根据经纬度获取地址
function reset_location()
{
var geoc = new BMap.Geocoder();
geoc.getLocation(point, function(rs){
var _value = rs.addressComponents;

var province = _value.province;
var city = _value.city;
var county = _value.district;
var street = _value.street + _value.streetNumber;
set_address(province, city, county, street);

m_address = province + city + county + street;
set_point(point.lng, point.lat);
});
}

//检索结果
function set_place()
{
map.clearOverlays();//清除地图上所有覆盖物
function myFun(){
point = local.getResults().getPoi(0).point;//获取第一个智能搜索的结果

initMap(point);

set_point(point.lng, point.lat);
}
//智能搜索
var local = new BMap.LocalSearch(map, {
onSearchComplete: myFun
});
local.search(m_address);
}

function set_address(province, city, county, street)
{
$("input[name='province']").val(province);
$("#province>span").html(province);
$("input[name='city']").val(city);
$("#city>span").html(city);
$("input[name='county']").val(county);
$("#county>span").html(county);
$("input[name='street']").val(street);
}
function set_point(lng, lat)
{
$("#lng").val(lng);
$("#lat").val(lat);
}
</script>
<!--地址选择end-->
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息