获取标记的经纬度（onclick）答案

【问题标题】：Get latitude and longitude of marker (onclick)获取标记的经纬度（onclick）
【发布时间】：2011-09-16 11:44:46
【问题描述】：

如何为标记创建侦听器并获取其纬度和经度。当我为单击事件的每个标记创建侦听器时，我可以在单击时执行诸如警报之类的操作，但是单击时如何获取标记的坐标，即click -> this.getLat/getLng 等？

【问题讨论】：

【解决方案1】：

试试这个：

marker = new google.maps.Marker({
             position: latlng,
             map: map                    
}); //end marker

//Add listener
google.maps.event.addListener(marker, "click", function (event) {
                    alert(this.position);
}); //end addListener

【讨论】：

this.position 未记录，您应该使用event Object 并使用lat() 和lng() 函数获取event.latLng。更好。
this.position 记录为this 在此上下文中指的是Marker 对象。 position 是标记上的属性。您也可以使用“事件”对象，在这种情况下您必须使用“latLng”属性，但请记住返回的latLng 将是单击时光标的位置，而不是标记位置。根据您想要的精度水平，这些差异很重要。

【解决方案2】：

作为 Bryan Weaver 出色回答的后续，如果要分别保存纬度和经度，则必须使用 lat() 和 lng()。 position 属性不是常规字符串。

bryan 的代码将变为：

marker = new google.maps.Marker({
             position: latlng,
             map: map                    
}); //end marker

//Add listener
google.maps.event.addListener(marker, "click", function (event) {
    var latitude = this.position.lat();
    var longitude = this.position.lng();
    alert(this.position);
}); //end addListener

您可以将 lat() 和 lng() 直接应用于变量 (latLng)

    var latitude = latLng.lat();
    var longitude = latLng.lng();

【讨论】：

【解决方案3】：

这里所有的答案都很好，

但我已经尝试过类似谷歌地图的东西。当您单击地图上的某个位置时，会显示一个标记，但当您单击其他位置时，旧标记会消失，而新标记会在文本字段中显示纬度和经度。

这是DEMO

  // In the following example, markers appear when the user clicks on the map.
  // The markers are stored in an array.
  // The user can then click an option to hide, show or delete the markers.
  var map;
  var markers = [];

  function initMap() {
    var haightAshbury = {lat: 23.2748308, lng: 77.4519248};

    map = new google.maps.Map(document.getElementById('map'), {
      zoom: 16.3,                        // Set the zoom level manually
      center: haightAshbury,
      mapTypeId: 'terrain'
    });

    // This event listener will call addMarker() when the map is clicked.
    map.addListener('click', function(event) {
      if (markers.length >= 1) {
          deleteMarkers();
      }

      addMarker(event.latLng);
      document.getElementById('lat').value = event.latLng.lat();
      document.getElementById('long').value =  event.latLng.lng();
    });
  }

  // Adds a marker to the map and push to the array.
  function addMarker(location) {
    var marker = new google.maps.Marker({
      position: location,
      map: map
    });
    markers.push(marker);
  }

  // Sets the map on all markers in the array.
  function setMapOnAll(map) {
    for (var i = 0; i < markers.length; i++) {
      markers[i].setMap(map);
    }
  }

  // Removes the markers from the map, but keeps them in the array.
  function clearMarkers() {
    setMapOnAll(null);
  }

  // Deletes all markers in the array by removing references to them.
  function deleteMarkers() {
    clearMarkers();
    markers = [];
  }
</script>
<script async defer
    src="http://maps.google.com/maps/api/js?sensor=false&callback=initMap">
</script>

所以这段代码的作用是，当您单击地图上的某个位置时，纬度和经度的值会显示在文本字段中。

【讨论】：