通过Google Maps API V3检索可拖动引脚的纬度和经度

Mac*_*xim 48 draggable latitude-longitude google-maps-api-3

我会解释.我设法在地图上有一个可拖动的针脚.我想检索此点的坐标并将它们放入两个字段:纬度和经度.稍后这些坐标将通过PHP发送到SQL表.这是我打算做的一个例子,但它只是一个而不是几个引脚,它是可拖动的.问题是:我甚至无法显示初始点的坐标.当然,当用户移动引脚时,我希望坐标也在字段中改变.我希望我清楚自己.我做错了什么?我应该使用地理编码服务吗?

这是JS:

<script type="text/javascript">
  var map;
  function initialize() {
  var myLatlng = new google.maps.LatLng(40.713956,-74.006653);

  var myOptions = {
     zoom: 8,
     center: myLatlng,
     mapTypeId: google.maps.MapTypeId.ROADMAP
     }
  map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

  var marker = new google.maps.Marker({
  draggable: true,
  position: myLatlng, 
  map: map,
  title: "Your location"
  });

  google.maps.event.addListener(marker,'click',function(overlay,point){
     document.getElementById("latbox").value = lat();
     document.getElementById("lngbox").value = lng();
     });

}
</script> 
Run Code Online (Sandbox Code Playgroud)

和HTML:

<html>
<body onload="initialize()">

  <div id="map_canvas" style="width:50%; height:50%"></div>

  <div id="latlong">
    <p>Latitude: <input size="20" type="text" id="latbox" name="lat" ></p>
    <p>Longitude: <input size="20" type="text" id="lngbox" name="lng" ></p>
  </div>

</body>
</html>
Run Code Online (Sandbox Code Playgroud)

ric*_*hie 80

这些都是工作

google.maps.event.addListener(marker, 'click', function (event) {
    document.getElementById("latbox").value = event.latLng.lat();
    document.getElementById("lngbox").value = event.latLng.lng();
});

google.maps.event.addListener(marker, 'click', function (event) {
    document.getElementById("latbox").value = this.getPosition().lat();
    document.getElementById("lngbox").value = this.getPosition().lng();
});
Run Code Online (Sandbox Code Playgroud)

您也可以考虑使用dragend事件

google.maps.event.addListener(marker, 'dragend', function (event) {
    document.getElementById("latbox").value = this.getPosition().lat();
    document.getElementById("lngbox").value = this.getPosition().lng();
});
Run Code Online (Sandbox Code Playgroud)

  • 嘿,谢谢,实际上我昨天用你提供的完全相同的代码解决了这个问题.所以我很高兴能够得到相同的结果.我昨天要回答我自己的问题,但StackOverFlow不会让我.显然我不能在8小时之前回答我自己的问题(新用户).这就是我被告知的事情.无论如何,谢谢你的回答. (2认同)