获得在谷歌地图点击标记的完整地址

Get full address of clicked marker in google maps

本文关键字：地址 谷歌地图      更新时间：2023-09-26

你能帮我用一下谷歌地图吗

我需要得到点击标记的完整地址，并在ASP标签控件中显示地址详细信息。事实上，我每次只显示一个标记。

E。展位号或门牌号:15街道名称:圣约瑟夫街郊区:西弗敦城市:约翰内斯堡纬度:24.8545经度:-28.23565

我使用以下JavaScript代码的地图和它的工作良好。

<script type="text/javascript">
    var map;
    var marker;
    var address;
    function initialize() {
        var latitude = document.getElementById('<%= hdnLat.ClientID%>').value;
        var longitude = document.getElementById('<%= hdnLng.ClientID%>').value;
        var myLatlng = new google.maps.LatLng(longitude, latitude);
        var mapOptions = {
            zoom: 18,
            center: myLatlng
        }
        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        marker = new google.maps.Marker({
            position: myLatlng,
            map: map,
            draggable:true,
            animation: google.maps.Animation.DROP
        });
        google.maps.event.addListener(marker, 'click', toggleBounce);
    }
    function toggleBounce() {
        if (marker.getAnimation() != null) {
            marker.setAnimation(null);
        } else {
            marker.setAnimation(google.maps.Animation.BOUNCE);
        }
    }
    google.maps.event.addDomListener(window, 'load', initialize);
</script>

我使用以下ASP控件来处理地图。

<asp:HiddenField ID="hdnLng" runat="server" />
<asp:HiddenField ID="hdnLat" runat="server" />
<div id="map-canvas" style="height:425px;"></div>
<asp:Label ID="addressStandNo" runat="server"></asp:Label>
<asp:Label ID="addressStreetName" runat="server"></asp:Label>
<asp:Label ID="addressSuburb" runat="server"></asp:Label>
<asp:Label ID="addressCity" runat="server"></asp:Label>
<asp:Label ID="addressLatitude" runat="server"></asp:Label>
<asp:Label ID="addressLongitude" runat="server"></asp:Label>
<asp:Label ID="addressPostalCode" runat="server"></asp:Label>

我只需要获得地图上单击标记的详细信息(地址)，并将这些值分配给上面列出的ASP控件。

提前感谢。

您必须在单击标记事件

时执行以下操作
  1. 使用latlng反向地理编码获取位置信息
  2. 在asp标签中显示返回的地理编码响应信息。参考地理编码响应

//Add listener
    google.maps.event.addListener(marker, "click", function(event) {
      toggleBounce() 
      showInfo(this.position);
    });
    
    function showInfo(latlng) {
      geocoder.geocode({
        'latLng': latlng
      }, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
          if (results[1]) {
            // here assign the data to asp lables
            document.getElementById('<%=addressStandNo.ClientID %>').value = results[1].formatted_address;
          } else {
            alert('No results found');
          }
        } else {
          alert('Geocoder failed due to: ' + status);
        }
      });
    }

相关文章：