是否可以爲RESTful Google Places API提供邊界框？

Question

我想請使用Google Places API或它的自動完成功能找到一個地方區，使用範圍（從谷歌獲取了地圖API地理編碼調用）。

自動完成API有一個在here中使用邊界的例子，但似乎沒有使用我的座標或原樣例'原樣'（只是替換了API密鑰）。

所以：我的問題是，將使它有可能檢索單一鎮境內的地方提供一個邊框，以地方API搜索？如果可能的話，自動完成API將更加方便使用。

Answer 1

我遇到同樣的問題，並在提交使用回調函數來解決它。 這是不理想的，因爲它仍然允許用戶選擇無效的地方，但然後我在提交過程中驗證。如果他們在自動完成功能上提供了一個回調（可能他們會這麼做，而我只是看不到它），那將會很好。

對於insance，我有一個非常簡單的表格，根據城市搜索目的地：

Choose a City: [ San Francisco ] 
Choose a Destination: [ Autocomplete Google Places API textbox ] 
[Submit Button] 

首先，我安裝我的城市選擇列表（我使用ASP.NET MVC在這裏，但你的想法） ：

<select id="citySelectId" title="Select a city"> 
    @foreach (var city in Model.AvailableCities) 
    { 
     <option value="@city.CityId" 
       data-ne-latitude="@city.NorthEastPos.Latitude" 
       data-ne-longitude="@city.NorthEastPos.Longitude" 
       data-sw-latitude="@city.SouthWestPos.Latitude" 
       data-sw-longitude="@city.SouthWestPos.Longitude" 
       @(Model.SelectedSearchCityId == @city.CityId ? "SELECTED" : string.Empty)>@city.CityState</option> 
    } 
</select> 

然後，我設置城市選擇列表上的一個jquery變化來更新我的自動完成：

$("#citySelectId").change(onSelectChange); 

呼叫onSelectChange是非常直截了當：

function onSelectChange() { 
    $('#destinationInputId').val(""); 

    var selected = $("#citySelectId option:selected"); 
    var nelat = selected[0].getAttribute('data-ne-latitude'); 
    var nelng = selected[0].getAttribute('data-ne-longitude'); 
    var swlat = selected[0].getAttribute('data-sw-latitude'); 
    var swlng = selected[0].getAttribute('data-sw-longitude'); 

    var cityLatLngBounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(swlat, swlng), 
     new google.maps.LatLng(nelat, nelng) 
    ); 

    if (autocomplete == undefined) { 
     autocomplete = new google.maps.places.Autocomplete(destinationInput, { bounds: cityLatLngBounds }); 
    } else { 
     autocomplete.setBounds(cityLatLngBounds) 
    } 

    google.maps.event.addListener(autocomplete, 'place_changed', function() { 
     var place = autocomplete.getPlace(); 
     if (!inCityBounds(place.geometry.location.lat(), place.geometry.location.lng())) { 
      popError("The destination you selected (" + place.name + ") does not fall within the city bounds"); 
     } 
    }); 
}; 

而且inCityBounds是很容易的：

function inCityBounds(lat, long) { 
    var selected = $("#citySelectId option:selected"); 
    var nelat = selected[0].getAttribute('data-ne-latitude'); 
    var nelng = selected[0].getAttribute('data-ne-longitude'); 
    var swlat = selected[0].getAttribute('data-sw-latitude'); 
    var swlng = selected[0].getAttribute('data-sw-longitude'); 

    var cityLatLngBounds = new google.maps.LatLngBounds(
     new google.maps.LatLng(swlat, swlng), 
     new google.maps.LatLng(nelat, nelng) 
    ); 

    var destination = new google.maps.LatLng(lat, long); 

    return cityLatLngBounds.contains(destination); 
}; 

的popError（）函數，只是顯示一些錯誤消息：

$('#errorSpanId').html(errorMsg).show(); 

而且那麼我的驗證/提交代碼會再次檢查它，如果該項不在範圍內，則返回false。

希望這有助於