地址解析

地址:

输入栏中输入地址详细信息(地址信息越详细越好,如:XX省XX市XX区XX路XX号),点击查询后会把该地址坐标标注在地图上

关键代码

function callback(a){//回调函数 标点
	 if (marker) {
	 	marker.setMap(null);
	 }
     if(a.status=='ok'){
         var data = a.data;
         for (var i = 0; i < data.length; i++) {
         	var geometry=a.data[0];
         	marker = new sogou.maps.Marker({
	             map:map,
	             title:geometry.address,
	             label:{
	             	visible:true
	             },
	             position:geometry.location,
	             visible:true
	         });
	         
	         map.setCenter(marker.getPosition());
         }
     }
};
function search(){
	var kw = document.getElementById("kw").value;
	var request={
	      address:{
	           addr:kw,
	           city:"全国"
	        }
	}
	var geo=new sogou.maps.Geocoder();
	geo.geocode(request,callback);
}
			

代码解析

首先要先初始化一个Geocoder实例,设置请求参数并获取参数值。调用geocode方法。

var request={
	address:{ //使用address参数
       addr:kw,//kw 为输入框中的地址
       city:"全国" //建议添加城市,写了城市结果会更准确
	}
}
var geo=new sogou.maps.Geocoder();
geo.geocode(request,callback);
			

接下来将地址解析的结果返回给回调函数,以标记的方式显示到地图上。

function callback(a){//回调函数 标点
     if(a.status=='ok'){//有结果返回
		 var data = a.data;
         for (var i = 0; i < data.length; i++) {
         	var geometry=a.data[0];//取出第一个结果
         	marker = new sogou.maps.Marker({//以第一个数据结果为准,创建一个标记
	             map:map,
	             title:geometry.address,
	             label:{
	             	visible:true
	             },
	             position:geometry.location,
	             visible:true
	         });
	         
	         map.setCenter(marker.getPosition());//地图中心移至此处
         }
     }

};
			

完整代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>地址解析</title>
<style type="text/css">
 	#map {
		width:500px;
		height:500px;
	}
	
	#option{
		height:50px;
		width:500px;
		border:solid 1px #CCCCCC;
		padding:10px;
	}
</style>
<script type="text/javascript" src="//api.go2map.com/maps/js/api_v2.5.1.js"></script>
</head>

<body>
	<div id="option">
		地址:<input type="text" id="kw"  size="55" />
		<input type="button"  value="查询" onclick="search()"/>
	</div>
	<div id="map"></div>
</body>
<script>
/**
*地址解析
*/
var marker = null;

var myLatLng = new sogou.maps.Point(12957062,4827187);
var myOptions = {
  zoom: 10,
  center: myLatLng
};
var map = new sogou.maps.Map(document.getElementById("map"), myOptions);
 
function callback(a){
	 if (marker) {
	 	marker.setMap(null);
	 }
     if(a.status=='ok'){
         var data = a.data;
         for (var i = 0; i < data.length; i++) {
         	var geometry=a.data[0];
         	marker = new sogou.maps.Marker({
	             map:map,
	             title:geometry.address,
	             label:{
	             	title:geometry.address,
	             	visible:true
	             },
	             position:geometry.location,
	             visible:true
	         });
	         
	         map.setCenter(marker.getPosition());
         }
     }
 
}

function search(){
	var kw = document.getElementById("kw").value;
	var request={
	      address:{
	           addr:kw,
	           city:"全国"
	        }
	}
	var geo=new sogou.maps.Geocoder();
	geo.geocode(request,callback);
}
</script>
</html>

			

运行代码