根据输入内容实现百度地图插件定位

拥有回忆 提交于 2019-12-03 11:03:40

实现思路:1.根据用户输入地址查询出经纬度坐标。

     2.将经纬度坐标传入展示地图页面,初始化定位。

     3.将最后确定的经纬度坐标存入对应字段中。

 

1.js实现根据用户输入地址获取其经纬度

this.checkmap=function(){
var address = LEAP.getValue(this.getMD("address"));
var ret = this.request("nvsi_getAreaInMap",{par:{location:address}});   //调用后台方法

if(ret.result){

Lng = ret.result.location.lng;
Lat = ret.result.location.lat;
LEAP.setValue(document.getElementById("longitude"),Lng);
LEAP.setValue(document.getElementById("latitude"),Lat);
}

Lng = LEAP.getValue(this.getMD("longitude"));
Lat = LEAP.getValue(this.getMD("latitude"));
this.Form = this.forms("swmscheckmapinfo", "insert");
LEAP.form.setTitle(this.Form.form,"地图定位");
this.Form.module.clearPageData();
this.Form.module.setData(this.data);
this.Form.show();
}

 

//后台服务

public EntityBean nvsi_getAreaInMap(EntityBean bean) {
try {
if (bean == null) {
  return null;
}
LngAndLatUtil LngAndLatUtil = new LngAndLatUtil();
EntityBean LngAndLat = LngAndLatUtil.getLngAndLat(bean.getString("location"));
return LngAndLat;
} catch (Exception e) {
e.printStackTrace();
return null;
}
}

//工具类

public String loadJSON(String url)
{
StringBuilder json = new StringBuilder();
try
{
URL oracle = new URL(url);
URLConnection yc = oracle.openConnection();
BufferedReader in = new BufferedReader(new InputStreamReader(yc.getInputStream()));
String inputLine = null;
while ((inputLine = in.readLine()) != null)
{
json.append(inputLine);
}
in.close();
}
catch (java.net.MalformedURLException oracle) {
}
catch (java.io.IOException oracle) {
}
return json.toString();
}

public EntityBean getLngAndLat(String address) {
EntityBean result = new EntityBean();
try
{
String url = "http://api.map.baidu.com/geocoder/v2/?address=" + address + "&output=json&ak=NSikRaje58n5B0jI4fj3T0v5oGNen8rX";
String json = loadJSON(url);
EntityBean obj = (EntityBean)JSONSerializer.getInstance().DeSerialize(json, EntityBean.class);
result = obj;
}
catch (Exception e) {
Global.getInstance().LogError(e);
}

return result;
}

 

弹出地图页面

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
body, html {width: 100%;height: 100%;margin:0;font-family:"微软雅黑";font-family:"微软雅黑";}
#allmap{width:100%;height:100%;}
</style>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=EfWgk6mpmWxlOIn8NWbG8v80NvaAFAlh"></script>
<title>地图</title>
</head>
<body>
<div>
<div id="allmap"></div>
</div>
</body>
</html>
<script type="text/javascript">
// 百度地图API功能
var Lng = null;
var Lat = null;
var address = null;
Lng = window.parent.document.getElementById("longitude").value;
Lat = window.parent.document.getElementById("latitude").value;
address = window.parent.document.getElementById("address").value;
var map = new BMap.Map("allmap",{enableMapClick:false});
var mkr = new BMap.Marker();
if(address &&Lng&&Lat) {
map.centerAndZoom(new BMap.Point(Lng, Lat), 15);// 初始化地图,设置中心点坐标和地图级别
mkr = new BMap.Marker(new BMap.Point(Lng, Lat));
map.addOverlay(mkr);
} else {
map.centerAndZoom(new BMap.Point(116.404, 39.915), 15);// 初始化地图,设置中心点坐标和地图级别
}
map.addEventListener("click", showInfo);
map.setDefaultCursor("url('bird.cur')");
map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用
map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用
map.addControl(new BMap.NavigationControl());// 添加平移缩放控件
map.addControl(new BMap.ScaleControl());// 添加比例尺控件
map.addControl(new BMap.OverviewMapControl());//添加缩略地图控件
map.enableScrollWheelZoom();//启用滚轮放大缩小
map.addControl(new BMap.MapTypeControl());//添加地图类型控件
var geoc = new BMap.Geocoder();
function showInfo(e){
map.removeOverlay(mkr);
mkr = new BMap.Marker(new BMap.Point(e.point.lng,e.point.lat), 15);
map.addOverlay(mkr);
map.centerAndZoom(new BMap.Point(e.point.lng,e.point.lat), 15);
geoc.getLocation(e.point, function(rs){
//addressComponents对象可以获取到详细的地址信息
var addComp = rs.addressComponents;
var site = "";
if(addComp.province=="北京市"||addComp.province=="上海市"||addComp.province=="天津市"||addComp.province=="重庆市"){
site = addComp.city + addComp.district + addComp.street + addComp.streetNumber;
}else{
site = addComp.province + addComp.city + addComp.district + addComp.street + addComp.streetNumber;
}
window.parent.getAddress(site,e.point.lng,e.point.lat);
alert("您设置的地址是:" + site);
//document.getElementByClassName("BMap_pop").style.display="none";
})
}
</script>

 

调用父页面方法将经纬度返回回去。

this.saveSet = function(){
window.parent.setAddress(address,lng,lat);
this.hideForm();//隐藏页面
}

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!