自动完成半径搜索在我的谷歌地图中不起作用答案

【问题标题】：Autocomplete radius search not working in my google maps自动完成半径搜索在我的谷歌地图中不起作用
【发布时间】：2018-04-24 13:48:21
【问题描述】：

我想在我的 gmaps 自动完成地点搜索上实现半径，所以我可以先从该半径获得搜索提示。

我的代码

var options = {
        types: [],
        componentRestrictions: {
            'country': 'IN'
        },
        location : { lat: 17.3850, lng: 78.4867 },
        radius : 5000
    };
    let inputPick = document.getElementById('pick');
    const autocompletePick = new google.maps.places.Autocomplete(inputPick, options);

    google.maps.event.addListener(autocompletePick, 'place_changed',  () => {
        let place =autocompletePick.getPlace();
        // console.log(place.name)
        // document.getElementById('pick').value = place.name;
        this.setState({pickAddress:place.name})
        let lat = place.geometry.location.lat(),
            lng = place.geometry.location.lng();
        //putting place in pick field
        let geocoder = new google.maps.Geocoder;
        geocoder.geocode({'location': {lat:lat,lng:lng}}, function(results, status) {
            if (status === 'OK') {
                // console.log(results[0].formatted_address)
                document.getElementById('pick').value = results[0].formatted_address;
            }
        })

但现在我正在全国各地。
我在谷歌上搜索但没有得到正确的解决方案。任何人都可以帮助我，我被卡住了）：

【问题讨论】：

developers.google.com/maps/documentation/javascript/examples/…

标签： javascript reactjs google-maps google-maps-api-3

【解决方案1】：

如果您查看 Google Maps JavaScript API 参考文档，您会发现 AutocompleteOptions 对象没有 location 和 radius 字段

https://developers.google.com/maps/documentation/javascript/reference/3/#AutocompleteOptions

相反，它有 bounds 字段来定义您要搜索的区域，strictBounds 字段将结果限制在该区域内。

您应该使用bounds 和strictBounds 自动完成选项重写您的代码。像

var options = {
    bounds: cityBounds,
    strictBounds: true,
    types: ['geocode'],
    componentRestrictions: { country: "IN" }
};

查看 bounds 文档了解更多详情

https://developers.google.com/maps/documentation/javascript/reference/3/#LatLngBounds

https://developers.google.com/maps/documentation/javascript/reference/3/#LatLngBoundsLiteral

我希望这会有所帮助！

【讨论】：