2012-06-22 166 views
20

我想通過提供具有城市名稱的API來獲取城市的經度和緯度。無論用戶如何輸入城市,它都應該適用於大多數城市。谷歌地圖獲取有城市名稱的經緯度?

例如:

市可「邁阿密,美國」或城市可以是「美國邁阿密」

如何打印緯度?

回答

45

,你可以找到代碼在這裏jsfiddled:http://jsfiddle.net/YphZw/ 以下:

$("#btn").click(function(){ 
 
      var geocoder = new google.maps.Geocoder(); 
 
    geocoder.geocode({ 'address': 'miami, us'}, function(results, status) { 
 
      if (status == google.maps.GeocoderStatus.OK) { 
 
      alert("location : " + results[0].geometry.location.lat() + " " +results[0].geometry.location.lng()); 
 
      } else { 
 
      alert("Something got wrong " + status); 
 
      } 
 
     }); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<html> 
 
<head> 
 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
</head> 
 
<body> 
 
    <input id="btn" type="button" value="search for miami coordinates" /> 
 
</body> 
 
</html>

如果你想要更多的例子對於Javascript API,請嘗試以下鏈接:https://developers.google.com/maps/documentation/javascript/examples/

我寫的代碼是靈感來自地理編碼 - 簡單的示例。

問候。

編輯1:

您可以使用非官方的PHP庫來實現它。檢查這個例子: http://www.bradwedell.com/phpgooglemapapi/demos/geocoding.php (代碼是在底部=

+0

有沒有辦法用PHP來做同樣的事情?謝謝 – lisovaccaro

12

您可以使用谷歌的地理編碼服務,例如,

http://maps.googleapis.com/maps/api/geocode/xml?address=Miami+FL&sensor=false

這讓你在各種格式(JSON,XML等)回地理參考數據。無論如何,該位置肯定在返回的數據塊中。

的API文檔在:

https://developers.google.com/maps/documentation/geocoding/

+0

您上面給出的API文檔鏈接和您描述的方法是關於Google Maps API Web服務,而不是Javascript的。 – Zakaria

+0

Doh!對不起 - 鏈接到JS API(很simllar)雖然在該頁面上。 – debracey

2

這似乎是不必要的複雜,下面是一個例子「附近的活動」地圖這需要City, State S,將它們轉換爲latLng COORDS,並把標記上。圖:

// Nearby Events with Google Maps 
window.nearbyEventsMap =() => { 
    const centerOfUS = { 
     lat: 37.09024, 
     lng: -95.712891 
    } 

    // Create a map object and specify the DOM element for display. 
    const map = new google.maps.Map(document.querySelector('#nearby_events_map'), { 
     center: centerOfUS, 
     scrollwheel: false, 
     zoom: 4 
    }) 

    // Create a marker and set its position. 
    const geocoder = new google.maps.Geocoder() 

    // Filter out duplicate cityStates 
    let cityStates = {} 
    document.querySelectorAll('.nearby_event_city_state').forEach(event => { 
     cityStates[event] = event.innerText 
    }) 

    // `cityState` is in the format of "City, State". It's not picky about state being a word or the abbreviation. 
    for (const cityState in cityStates) { 
     const location = cityStates[cityState] 

     geocoder.geocode({ 
      address: location 
     }, function (results, status) { 
      if (status === 'OK') { 
       const result = results[0].geometry.location 
       const lat = result.lat() 
       const lng = result.lng() 
       const latLng = { 
        lat, 
        lng 
       } 

       return new google.maps.Marker({ 
        map: map, 
        position: latLng 
       }) 
      } 
     }) 
    } 
} 
// /Nearby Events with Google Maps 

確保包括您的<script>標籤

<script src="/dist/js/main.js"></script> 

<!-- We're loading this after the main.js script so the callback from main.js will be available to it. --> 
<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&callback=nearbyEventsMap"></script> 

的StackOverflow請加入其他人都和G et GitHub markdown with syntax highlighting ...

相關問題