是否可以为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。

希望这有助于