高德地图之经纬度

本文把高德地图的鼠标点击获取经纬度与点标记与地理编码融合到了一起

首先要创建自己的应用，并且添加key（服务用到的JavaScript API）

先把获取经纬度的代码复制过来，进行修改取消地图的点击操作。放到marker点击效果里

var clickEventListener = map.on('click', function(e) {

document.getElementById("lnglat").value = e.lnglat.getLng() + ',' + e.lnglat.getLat()

});

并且在select方法里面添加地图监听

function select(e) {

AMap.event.addListener(placeSearch, "complete", keywordSearch_CallBack);//返回地点查询结果

placeSearch.setCity(e.poi.adcode);

placeSearch.search(e.poi.name);  //关键字查询查询

}

keywordSearch_CallBack这个方法用来获取marker的个数，来对marker进行修改

function keywordSearch_CallBack(data) {

var resultStr = "";

var poiArr = data.poiList.pois;

var resultCount = poiArr.length;

for (var i = 0; i < resultCount; i++) {

addmarker(i, poiArr[i]);

}

map.setFitView();

}

添加marker并且对窗体进行了修改

function addmarker(i, d) {    

var lngX = d.location.getLng();      

var latY = d.location.getLat();     

var markerOption = {          

map:map,          

icon:"http://webapi.amap.com/images/" + (i + 1) + ".png",          

zIndex:200,       

clickable:true,        

offset:new AMap.Pixel(-10,-34),        

position:new AMap.LngLat(lngX, latY)      };             

 var mar = new AMap.Marker(markerOption);               

 marker.push(new AMap.LngLat(lngX, latY));        

var infoWindow = new AMap.InfoWindow({          

content:"

" + (i + 1) + ". " + d.name + "

" + TipContents(d.type, d.address, d.tel),         

size:new AMap.Size(300, 0),          

 autoMove:true,            

offset:new AMap.Pixel(0,-30)     

 });      

windowsArr.push(infoWindow);      

 var aa = function (e) {infoWindow.open(map, mar.getPosition());};      

AMap.event.addListener(mar, "click", aa);      

AMap.event.addListener(mar,'click',getLnglat); }//marker点击效果

function TipContents(type, address, tel) {  //窗体内容     

if (type == "" || type == "undefined" || type == null || type == " undefined" || typeof type == "undefined") {          type = "暂无";      }     

if (address == "" || address == "undefined" || address == null || address == " undefined" || typeof address == "undefined") {          address = "暂无";      }     

if (tel == "" || tel == "undefined" || tel == null || tel == " undefined" || typeof address == "tel") {          tel = "暂无";      }      var str = "  地址：" + address + "

电话：" + tel + "类型：" + type;     

 return str;  }

//鼠标在地图上点击，获取经纬度坐标

function getLnglat(e) {

document.getElementById("lngX").value = e.lnglat.getLng();

document.getElementById("latY").value = e.lnglat.getLat();

}

此时效果已经实现的差不多，就差一步，当文本框里面有经纬度的时候，在地图上显示当前位置即可

$(document).ready(function(){

if($("#lngX").val()!=""){

var lngX = $("#lngX").val();

var latY = $("#latY").val();

lnglatXY = [lngX, latY]; //已知点坐标

//逆地理编码

var geocoder = new AMap.Geocoder({

radius: 1000,

extensions: "all"

});

var marker = new AMap.Marker({  //加点

map: map,

position: lnglatXY

});

map.setFitView();

}

});

END