Google maps api 3 从谷歌自动完成过滤结果

有没有一种方法可以在谷歌自动完成API的结果显示在输入下方之前，从中获取结果？我想展示除美国以外的任何国家的结果

我发现了这个问题：但是它没有用，因为方法

getQueryPredictions

只返回5个元素

这是英国和美国结果的一个例子：

---

有可能吗？

我使用jquery自动完成小部件并手动调用google方法

对于我们的案例，我们只想显示美国密歇根州的地址。 由于谷歌不允许过滤到那种程度的回复，所以你必须手动过滤

重写jquery自动完成的源函数

调用google autocompleteService.getQueryPredictions方法

过滤出您想要的结果，并将其作为jquery自动完成的“响应”回调返回

或者，如果您需要从Google获得有关所选项目的更多详细信息，请覆盖jquery自动完成的select函数，并调用Google的placeService.getDetails方法

下面假设您有“places”库的GoogleAPI引用

var\u自动完成服务；//在脚本中全局定义
var _placesService；//在脚本中全局定义
//...
//为google places设置自动完成包装器
//我们城市的起点
var defaultBounds=new google.maps.LatLngBounds(
新的google.maps.LatLng（'42.9655426'，'-85.6769166'），
新的google.maps.LatLng（'42.9655426'，'-85.6769166'）；
if（_autoCompleteService==null）{
_autoCompleteService=新建google.maps.places.autoCompleteService（）；
}
$（“#CustomerAddress_Street”）.自动完成({
最小长度：2，
来源：功能（请求、响应）{
如果（request.term！=''）{
var googleRequest={
输入：request.term，
界限：默认界限，
类型：[“地理编码”]，
组件限制：{'country'：['us']}，
字段：['geometry'，'formatted_address']
}
_autoCompleteService.getQueryPredictions（谷歌请求，函数（预测）{
var michiganOnly=new Array（）；//仅保存密歇根州地址的数组
对于（变量i=0；i<0.length；i++）{
如果（预测[i].terms.length>0）{
//找到状态项。可能假设它是预测[4]，但不确定它是否有保证。
对于（var j=0；j<预测[i].terms.length；j++）{
if（预测[i].术语[j].value.length==2）{
如果（预测[i].terms[j].value.toUpperCase（）=='MI'）{
推（预测[i]）；
}
}
}
}
}
反应（米奇加诺利）；
});
}
},
选择：功能（事件、用户界面）{
如果（ui！=null）{
var item=ui.item；
var请求={
placeId:ui.item.place\u id
}
if（_placesService==null）{
$（“body”）.append（“”；//PlacesService（）需要一个字段将其属性图像放入其中。现在，只需在body上加上
_placesService=new google.maps.places.placesService（document.getElementById（'GoogleAttribute'）；
}
_placesService.getDetails（请求、函数（结果、状态）{
如果（结果！=null）{
const place=结果；
如果（！place.geometry）{
//用户输入了未建议的地点的名称，然后
//按Enter键，或Place Details请求失败。
//window.alert（“没有可供输入的详细信息：“+place.name+””）；
返回；
}
否则{
var latitude=place.geometry.location.lat（）；
var longitude=place.geometry.location.lng（）；
//用Lat/Lng做点什么
}
}
});
}
}
}).autocomplete（“实例”）。\u renderItem=函数（ul，项）{
//item是调用getQueryPredictions返回的预测对象
//返回预测对象的“description”属性或执行其他操作
返回$（“
”）
.append（“+item.description+”）
.附录（ul）；
};
$（“#CustomerAddress_Street”）.autocomplete（“实例”）。_renderMenu=函数（ul，项目）{
//谷歌的术语需要属性，因此在构建菜单时，添加一个指向其图像的项目
var=这个；
$。每个（项目、功能（索引、项目）{
即._renderItemData（ul，项目）；
});
$（ul）.追加（“
”）
}

我不知道你是怎么做到的。您可以将搜索限制为特定国家或特定边界，但不能从结果中排除某个国家。你可以随时放置一个@Upsidown已经有人建议：2年前..好吧，这真的不一样（限制多个国家与排除一个国家（或多个国家顺便说一句）），但无论如何，这个问题已经存在了将近2年了，而且感觉没有对此采取任何措施。。。无论如何，您都可以记录另一个功能请求。

<script src="https://maps.googleapis.com/maps/api/js?key=[yourKeyHere]&libraries=places&v=weekly" defer></script>

var _autoCompleteService; // defined globally in script
var _placesService; // defined globally in script

//...

// setup autocomplete wrapper for google places 

// starting point in our city
    var defaultBounds = new google.maps.LatLngBounds(
         new google.maps.LatLng('42.9655426','-85.6769166'),
         new google.maps.LatLng('42.9655426','-85.6769166'));

   
    if (_autoCompleteService == null) {
        _autoCompleteService = new google.maps.places.AutocompleteService();
    }
    
    $("#CustomerAddress_Street").autocomplete({
        minLength: 2,
        source: function (request, response) {
            if (request.term != '') {
                var googleRequest = {
                    input: request.term,
                    bounds: defaultBounds,
                    types: ["geocode"],
                    componentRestrictions: { 'country': ['us'] },
                    fields: ['geometry', 'formatted_address']
                }
                _autoCompleteService.getQueryPredictions(googleRequest, function (predictions) {
                    var michiganOnly = new Array(); // array to hold only addresses in Michigan
                
                    for (var i = 0; i < predictions.length; i++) {
                        if (predictions[i].terms.length > 0) {
                            // find the State term. Could probably assume it's predictions[4], but not sure if it is guaranteed.
                            for (var j = 0; j < predictions[i].terms.length; j++) {
                                if (predictions[i].terms[j].value.length == 2) {
                                    if (predictions[i].terms[j].value.toUpperCase() == 'MI') {
                                        michiganOnly.push(predictions[i]);
                                    }
                                }
                            }
                        }
                    }
                    response(michiganOnly);
                });
            }
        },
        select: function (event, ui) {
            if (ui != null) {
                var item = ui.item;
                var request = {
                    placeId: ui.item.place_id
                }

                if (_placesService == null) {
                    $("body").append("<div id='GoogleAttribution'></div>"); // PlacesService() requires a field to put it's attribution image in. For now, just put on on the body
                    _placesService = new google.maps.places.PlacesService(document.getElementById('GoogleAttribution'));
                }
                _placesService.getDetails(request, function (result, status) {
                    if (result != null) {
                        const place = result;
                        
                        if (!place.geometry) {
                            // User entered the name of a Place that was not suggested and
                            // pressed the Enter key, or the Place Details request failed.
                            //window.alert("No details available for input: '" + place.name + "'");
                            return;
                        }
                        else {
                            var latitude = place.geometry.location.lat();
                            var longitude = place.geometry.location.lng();
                        // do something with Lat/Lng
                        }
                    }
                });
            }
        }

    }).autocomplete("instance")._renderItem = function (ul, item) {
    // item is the prediction object returned from our call to getQueryPredictions
    // return the prediction object's "description" property or do something else
        return $("<li>")
            .append("<div>" + item.description + "</div>")
            .appendTo(ul);
    };
    $("#CustomerAddress_Street").autocomplete("instance")._renderMenu = function (ul, items) {
    // Google's terms require attribution, so when building the menu, append an item pointing to their image
        var that = this;
        $.each(items, function (index, item) {
            that._renderItemData(ul, item);
        });
        $(ul).append("<li class='ui-menu-item'><div style='display:flex;justify-content:flex-end;'><img src='https://maps.gstatic.com/mapfiles/api-3/images/powered-by-google-on-white3.png' /></div></li>")
    }