Javascript 在谷歌地图中点击矩形时，如何获取纬度和经度？

我已经在谷歌地图中创建了矩形，并希望在用户单击矩形时以代码形式获取纬度和经度

当我在矩形外单击时，我获得纬度和经度。但是，当我单击矩形时，我无法获得纬度和经度

这是我的代码：

var rectangle;
var map;
var infoWindow;

function initialize() {
  function calcBounds(center, size) {
    var n = google.maps.geometry.spherical.computeOffset(center, size.height / 2, 0).lat(),
      s = google.maps.geometry.spherical.computeOffset(center, size.height / 2, 180).lat(),
      e = google.maps.geometry.spherical.computeOffset(center, size.width / 2, 90).lng(),
      w = google.maps.geometry.spherical.computeOffset(center, size.width / 2, 270).lng();
  return new google.maps.LatLngBounds(new google.maps.LatLng(s, w),
      new google.maps.LatLng(n, e));
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'), {
    zoom: 12,
    center: new google.maps.LatLng(40.689055, -89.584747),
    mapTypeId: google.maps.MapTypeId.TERRAIN
  });



  var rectangle = new google.maps.Rectangle({
    strokeColor: '#000000',
    strokeOpacity: 1,
    strokeWeight: 1,
    fillColor: '#008000',
    fillOpacity: .2,
    editable: false,
    draggable: false,
    map: map,
    bounds: calcBounds(new google.maps.LatLngBounds(
        new google.maps.LatLng(40.626805, -89.539396),
        new google.maps.LatLng(40.626055, -89.538507)).getCenter(), new google.maps.Size(875, 875))
  });



  var rectangle = new google.maps.Rectangle({
    strokeColor: '#000000',
    strokeOpacity: 1,
    strokeWeight: 1,
    fillColor: '#008000',
    fillOpacity: .2,
    editable: false,
    draggable: false,
    map: map,
    bounds: calcBounds(new google.maps.LatLngBounds(
        new google.maps.LatLng(40.750555, -89.633655),
        new google.maps.LatLng(40.749805, -89.632766)).getCenter(), new google.maps.Size(875, 875))
  });



  var rectangle = new google.maps.Rectangle({
    strokeColor: '#000000',
    strokeOpacity: 1,
    strokeWeight: 1,
    fillColor: '#008000',
    fillOpacity: .2,
    editable: false,
    draggable: false,
    map: map,
    bounds: calcBounds(new google.maps.LatLngBounds(
        new google.maps.LatLng(40.626805, -89.519833),
        new google.maps.LatLng(40.626055, -89.518943)).getCenter(), new google.maps.Size(875, 875))
  });
  google.maps.event.addListener(map, 'click', function(event) {
    alert("Latitude: " + event.latLng.lat() + " " + ", longitude: " + event.latLng.lng());
  });

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

---

任何建议都将不胜感激，谢谢

您需要在每个矩形中添加一个单击事件。例如：

 google.maps.event.addListener(rectangle, 'click', function( event ){
  alert( "Latitude: "+event.latLng.lat()+" "+", longitude: "+event.latLng.lng() ); 
 });  

---

您需要向每个矩形添加一个单击事件。例如：

 google.maps.event.addListener(rectangle, 'click', function( event ){
  alert( "Latitude: "+event.latLng.lat()+" "+", longitude: "+event.latLng.lng() ); 
 });  

---

您可以将侦听器附加到

矩形

，就像对

映射

所做的那样

google.maps.event.addListener(rectangle, 'click', function(event) {
  alert('latitude: ' + event.latLng.lat() + ' , longitude: ' + event.latLng.lng()); 
});

---

这里的示例

您可以将侦听器附加到

矩形

，就像您对

映射

所做的那样

google.maps.event.addListener(rectangle, 'click', function(event) {
  alert('latitude: ' + event.latLng.lat() + ' , longitude: ' + event.latLng.lng()); 
});

---

这里的示例

Sport Billy，我使用矩形代替映射来使用此代码，问题是我使用了600个矩形，并更改了rct1、rct2等的名称。您不能有3个同名的不同变量，并期望使用相同的名称将一个侦听器附加到所有这些变量。执行此操作时，侦听器将附加到最后一个名为

rectangle

的变量。另一种选择是在声明每个变量后添加侦听器，如此处所示，或者更好，以避免重复写入同一侦听器，使其成为此处所示的函数。好的，这也是正确的。我找到了另一种解决方案。当我创建带循环的重调角时，所以我可以给出每个矩形的名称，并使用循环进行均匀单击。它可以工作。我们不需要更改矩形的名称。我只需将其放入循环中。使用此addListener，每个变量矩形后面都会出现。Sport Billy，我使用此代码，使用矩形代替贴图，问题是我hv 600个矩形。u r更改了rct1、rct2的名称，等等。你不能有3个不同的变量，它们的名称相同，而期望一个监听器通过使用相同的名称连接到所有的变量。执行此操作时，侦听器将附加到最后一个名为

rectangle

的变量。另一种选择是在声明每个变量后添加侦听器，如此处所示，或者更好，以避免重复写入同一侦听器，使其成为此处所示的函数。好的，这也是正确的。我找到了另一种解决方案。当我创建带循环的重调角时，因此，我可以给出每个矩形的名称，然后使用循环单击。它可以工作。我们无需更改矩形的名称。我只需将其放入循环中。使用此addListener，每个变量矩形之后都会出现。然后创建一个函数处理程序，然后通过矩形数组循环并添加处理程序。。。看这里：好的，Thanx，检查Sport Billy的解决方案。我只是把代码放在循环中，这样它就位于每个矩形下。选中此处，然后创建一个函数处理程序，然后在矩形数组中循环并添加处理程序。。。看这里：好的，Thanx，检查Sport Billy的解决方案。我只是把代码放在循环中，这样它就位于每个矩形下。检查这里