如何将Google地图位置库的自动填充限制为仅针对一个城市的地方的建议？

Question

我目前正在使用给定的代码,但这仅限于向一个国家/地区提出建议.我见过一个实现,但它使用jQuery,我想在不使用jQuery的情况下完成它.

var input = document.getElementById('searchTextField');
var options = {
    //types: ['(cities)'],
    componentRestrictions: { country: 'pk' }
};
var autocomplete = new google.maps.places.Autocomplete( input, options );

Answer 1

尝试将bounds属性添加到options要传递给Autocomplete构造函数的对象,如以下代码所示:

var southWest = new google.maps.LatLng( 25.341233, 68.289986 );
var northEast = new google.maps.LatLng( 25.450715, 68.428345 );
var hyderabadBounds = new google.maps.LatLngBounds( southWest, northEast );

var options = {
    bounds: hyderabadBounds,
    types:  ['establishment [or whatever fits your usage]'],
    componentRestrictions: { country: 'pk' }
};

如果希望Autocomplete边界由地图的当前视口驱动,则可以使用以下方式绑定地图的边界Autocomplete:

autocomplete.bindTo('bounds', map);

或者,如果它在您的应用程序中运行得更好,您还可以选择在必要时显式设置边界:

autocomplete.setBounds( someOtherBounds );

这可能意味着您创建了一个默认城市,就像我在上面的示例中对Hyberabad所做的那样.或者,您允许用户从要启动的城市列表中进行选择,然后将地图视口设置为所选城市.的Autocomplete,如果你只用开始时会建议城市名称componentRestrictions的country 'PK',你已经在做.您将了解哪种方法最适合您的应用.

最后,这并没有真正完全限制Autocomplete到城市,但它将尽可能地达到你想要的结果.