如何從google maps v3 api獲取經度和緯度？

我正在嘗試使用Google地圖v3 api創建地圖。我通過互聯網找到了下面的代碼，我想在地圖窗口中顯示緯度和緯度而不是地址。如何從google maps v3 api獲取經度和緯度？

<script> 
     function initialize() { 
     var mapOptions = { 
      center: new google.maps.LatLng(-33.8688, 151.2195), 
      zoom: 13, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById('map_canvas'), 
      mapOptions); 

     var input = document.getElementById('searchTextField'); 
     var autocomplete = new google.maps.places.Autocomplete(input); 

     autocomplete.bindTo('bounds', map); 

     var infowindow = new google.maps.InfoWindow(); 
     var marker = new google.maps.Marker({ 
      map: map 
     }); 

     google.maps.event.addListener(autocomplete, 'place_changed', function() { 
      infowindow.close(); 
      marker.setVisible(false); 
      input.className = ''; 
      var place = autocomplete.getPlace(); 
      if (!place.geometry) { 
      // Inform the user that the place was not found and return. 
      input.className = 'notfound'; 
      return; 
      } 

      // If the place has a geometry, then present it on a map. 
      if (place.geometry.viewport) { 
      map.fitBounds(place.geometry.viewport); 
      } else { 
      map.setCenter(place.geometry.location); 
      map.setZoom(17); // Why 17? Because it looks good. 
      } 
      var image = { 
      url: place.icon, 
      size: new google.maps.Size(71, 71), 
      origin: new google.maps.Point(0, 0), 
      anchor: new google.maps.Point(17, 34), 
      scaledSize: new google.maps.Size(35, 35) 
      }; 
      marker.setIcon(image); 
      marker.setPosition(place.geometry.location); 
      marker.setVisible(true); 

      var address = ''; 
      if (place.address_components) { 
      address = [ 
       (place.address_components[0] && place.address_components[0].short_name || ''), 
       (place.address_components[1] && place.address_components[1].short_name || ''), 
       (place.address_components[2] && place.address_components[2].short_name || '') 
      ].join(' '); 
      } 

      infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address); 
      infowindow.open(map, marker); 
     }); 

     // Sets a listener on a radio button to change the filter type on Places 
     // Autocomplete. 
     function setupClickListener(id, types) { 
      var radioButton = document.getElementById(id); 
      google.maps.event.addDomListener(radioButton, 'click', function() { 
      autocomplete.setTypes(types); 
      }); 
     } 

     setupClickListener('changetype-all', []); 
     setupClickListener('changetype-establishment', ['establishment']); 
     setupClickListener('changetype-geocode', ['geocode']); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
    </head> 
    <body> 
    <div> 
     <input id="searchTextField" type="text" size="50"> 
     <input type="radio" name="type" id="changetype-all" checked="checked"> 
     <label for="changetype-all">All</label> 

     <input type="radio" name="type" id="changetype-establishment"> 
     <label for="changetype-establishment">Establishments</label> 

     <input type="radio" name="type" id="changetype-geocode"> 
     <label for="changetype-geocode">Geocodes</lable> 
    </div> 
    <div id="map_canvas"></div> 
    </body> 
</html>

請有人幫我獲取並顯示經緯度。謝謝， Enamul

來源

2013-03-14 ehp

如果你有

var address = ''; 
    if (place.address_components) { 
    address = [ 
     (place.address_components[0] && place.address_components[0].short_name || ''), 
     (place.address_components[1] && place.address_components[1].short_name || ''), 
     (place.address_components[2] && place.address_components[2].short_name || '') 
    ].join(' '); 
    } 

    infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + address); 
    infowindow.open(map, marker);

更改信息窗口行改爲

infowindow.setContent('<div><strong>' + place.name + '</strong><br>' + place.geometry.location.lat() + ',' + place.geometry.location.lng());

來源

2013-03-14 18:29:27 Rafe

謝謝，它解決了我的問題。但是我還有一個問題，只能顯示緯度，經度和地址，而不顯示地圖。如果可能的話。 – ehp 2013-03-14 18:35:19

請閱讀[使用條款]（https://developers.google.com/maps/faq#tos）。它看起來像[]（https://developers.google.com/places/uplift?hl=en），您可以在沒有地圖的情況下顯示地點內容，但必須顯示「由Google支持」徽標。如果你沒有地圖，不知道你需要什麼座標。在這種情況下，您可能不想使用Google Maps API v3，只需[Places API]（https://developers.google.com/places/）即可。 – geocodezip 2013-03-14 18:46:42

我只是問了解一下。我會在地圖上顯示它。順便說一句，我也想顯示城市名稱和狀態的縮寫。說新澤西州普林斯頓。我想展示普林斯頓，nj。如何做到這一點或有可能獲得州名縮寫？ – ehp 2013-03-14 20:14:25

看起來你可能會尋找只是普通的地理定位的東西？這裏是我的一個項目中的snippett來抓取一個用戶的緯度/長度

trigger show_user_location（）;開始地理定位API。

function show_user_location(){ 

    navigator.geolocation.getCurrentPosition(display_user_location, error_response); 
} 
function display_user_location(user_position){ 
    var lat = user_position.coords.latitude; 
    var lon = user_position.coords.longitude; 

// once we get here make that AJAX query 
// #loc.value="<p>Your latitude is: "+lat+", your longitude is: "+lon+"</p>"+ "<p><a href='http://maps.google.com/?q="+lat+","+lon+"'>View your location on Google Maps</a></p>"; 

    // I often put the lat/lon in a hidden form for later retrieval here. 
    // value = document.getElementById('lat').value; 
    // value = document.getElementById('lat').value; 

    document.getElementById("lat").value = lat; 
    document.getElementById("long").value = lon; 

}

來源

2013-08-07 14:18:20 BenRacicot

看看這個代碼..

<!DOCTYPE html> 
<html> 
<head> 
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&libraries=places"></script> 
    <script> 
     function initialize() { 
     var address = 'Kolkata'; 
      geocoder = new google.maps.Geocoder(); 
      geocoder.geocode({ 
      'address': address 
      }, function(results, status) {  
       var lat=document.getElementById("lat").innerHTML=results[0].geometry.location.lat();  
       var lng=document.getElementById("lng").innerHTML=results[0].geometry.location.lng();   
      }); 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 
</head> 
<body> 
    <p id="lat"></p> 
    <p id="lng"></p> 
</body> 
</html>

來源

2013-11-08 06:33:41 user2791641

更簡單的解決將是：

var address = "New Delhi" 
$.ajax({ 
    url:"http://maps.googleapis.com/maps/api/geocode/json?address="+address+"&sensor=false", 
    type: "POST", 
    success:function(res){ 
    console.log(res.results[0].geometry.location.lat); 
    console.log(res.results[0].geometry.location.lng); 
    } 
});

乾杯

來源

2013-11-11 05:26:17

這不會觸發「同源」域問題？ – 2014-08-05 10:09:46

@FranciscoPresencia：它不會拋出跨域問題.. :) ..你可以簡單地爲自己運行它，看看.. :) – 2014-08-06 12:21:46

很確定這是對付的ToS。爲什麼不使用更加用戶友好的[自動填充]（https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform）？ – Walf 2015-03-10 06:42:18

當你想lat和長任何部分嘗試爲地圖添加點擊偵聽器，而不是標記。代碼應該如下所示：

var infowindow = new google.maps.InfoWindow(); 
    var service = new google.maps.places.PlacesService(map); 

    service.getDetails({ 
     placeId: 'ChIJN1t_tDeuEmsRUsoyG83frY4' 
    },function(place,status){ 
     if(status === google.maps.places.PlacesServiceStatus.OK) 
     { 
      var marker = new google.maps.Marker({ 
       map:map, 
       position: place.geometry.location 

      }); 

     google.maps.event.addListener(map, 'click', function(e) { 
      infowindow.setContent('<div>'+'Longitute'+'<strong>' + e.latLng.lng() + '</strong><br>' + 
      'Latitude:'+'<strong>' + e.latLng.lat()+'</strong>' + '</div>'); 
      infowindow.open(map, this); 
     }); 
     } 
    });

這將使用信息窗口顯示地圖上任何位置的緯度和經度。

來源

2017-01-20 11:00:38

如何從google maps v3 api獲取經度和緯度？

回答

相關問題