如何获取可拖动标记latlng信息

时间:2015-04-17 11:36:26

标签: javascript html google-maps google-maps-api-3

我正在制作一个进行地理编码的解决方案,我可以从adresse获得coords,并在此adresse上添加一个标记,我试图使这个标记draggabele,每次我用鼠标更改标记位置,我必须得到新的库克斯,有人能帮帮我吗?

编辑:使用event.addlistner解决方案

这是我的代码(js + html)

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<title>Geocoding service</title>
<style>
  html, body, #map-canvas {
    height: 100%;
    margin: 0px;
    padding: 0px
  }
  #panel {
    position: absolute;
    top: 5px;
    left: 50%;
    margin-left: -180px;
    z-index: 5;
    background-color: #fff;
    padding: 5px;
    border: 1px solid #999;
  }
</style>
<script src="https://maps.googleapis.com/maps/api/js?    v=3.exp&signed_in=true"></script>
<script>
var geocoder;
var map;
function initialize() {
  geocoder = new google.maps.Geocoder();
  var latlng = new google.maps.LatLng(34.042145, -4.997128);
  var mapOptions = {
   zoom: 5,
  center: latlng
 }
 map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}

   function codeAddress() {
  var address = document.getElementById('address').value;
 var lg;
 var lat;
 geocoder.geocode( { 'address': address}, function(results, status) {
  if (status == google.maps.GeocoderStatus.OK) {
  map.setCenter(results[0].geometry.location);

  map.setZoom(16);

   var lat = results[0].geometry.location.lat();
   document.getElementById('latitude').value = lat;  

   var lg = results[0].geometry.location.lng();
   document.getElementById('longitude').value = lg;


  var marker = new google.maps.Marker({
      map: map,
      position: results[0].geometry.location,
      draggable : true 
  });
} 

  else {
  alert('Geocode was not successful for the following reason: ' + status);
}
});
}

google.maps.event.addDomListener(window, 'load', initialize);

</script>
</head>
 <body>
  <div id="panel">
  <input id="address" type="textbox">
  <input id="latitude" type="textbox" >
  <input id="longitude" type="textbox" >
  <input type="button" value="Geocode" onclick="codeAddress()">
</div>
<div id="map-canvas"></div>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

使用Google地图&#39; getPosition功能:

google.maps.event.addListener(marker,"dragend",function(){
    document.getElementById("latitude").value=marker.getPosition().lat();
    document.getElementById("longitude").value=marker.getPosition().lng();
});