如何为 Google 地点 API 自动完成文本框设置默认值
我正在处理一个与 Google 示例 https://developers.google.com/maps/documentation/javascript/examples/places-autocomplete-addressform 中的页面非常接近的页面，并且它运行良好。
但是我需要添加另一个功能，即默认情况下将自动完成的值设置为当前用户城市。
我使用以下代码通过 HTML5 中的地理位置 API 获取登录用户的城市和国家/地区。但是挑战在于让自动完成接受此值作为其默认值。当我尝试直接将值放入文本框中时，自动完成功能会将其视为错误值。
navigator.geolocation.getCurrentPosition(function(pos) {
var currentLocation = new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude);
var geocoder = new google.maps.Geocoder();
var city = "";
var country = "";
geocoder.geocode({'latLng': currentLocation}, function(results, status, from) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[1]) {
for (var i = 0; i < results[0].address_components.length; i++) {
for (var b = 0; b < results[0].address_components[i].types.length; b++) {
if (results[0].address_components[i].types[b] == "administrative_area_level_1") {
city = results[0].address_components[i];
break;
}
if (results[0].address_components[i].types[b] == "country") {
country = results[0].address_components[i];
break;
}
}
}
var fromDefault = city.long_name + " - " + country.long_name;
$('#address-from').val(fromDefault);
}
}
});
},
function(error) {
alert('Unable to get location: ' + error.message);
}, options);
知道如何手动填写自动完成位置文本框的默认值吗？
我也有同样的要求，即在地图初始加载时设置初始位置。
这是我的做法：
正如 Jon Hannah 所提到的，我使用自动完成服务来获取预测，然后使用第一个预测来获取地点（使用 place_id）。使用我的默认位置字符串填充自动完成输入。 最后触发 place_change 事件。
this.input.nativeElement.value = this.testLocationStr;
let autocompleteService = new google.maps.places.AutocompleteService();
let request = {input: this.testLocationStr};
autocompleteService.getPlacePredictions(request, (predictionsArr, placesServiceStatus) => {
console.log('getting place predictions :: predictionsArr = ', predictionsArr, '\n',
'placesServiceStatus = ', placesServiceStatus);
let placeRequest = {placeId: predictionsArr[0].place_id};
let placeService = new google.maps.places.PlacesService(this.mapObj);
placeService.getDetails(placeRequest, (placeResult, placeServiceStatus) => {
console.log('placeService :: placeResult = ', placeResult, '\n',
'placeServiceStatus = ', placeServiceStatus);
this._handlePlaceChange(placeResult);
});
});
我在尝试解决类似用例（用用户搜索的最后一个地点填充自动完成功能）时偶然发现了这篇文章。
据我所知，无法为自动完成功能设置将其识别为地点的默认值。但是，我认为您可以使用 自动完成服务 （ 示例 - 另请参阅 #AutocompletePrediction 和 #PlacesService 的参考部分）模拟此效果：
- 将您的自动完成设置为已识别的城市和国家/地区
- 将城市和国家/地区传递给自动完成服务
- 确定您首选预测的地点 ID（例如，选择类型为“city”的第一个预测）
- 使用地点服务获取所选地点 ID 的详细信息（PlaceResult）（与使用 autocomplete.getPlace() 的结果相同）
- 有一个使用 PlaceResult 执行所需操作的回调
这会给用户留下自动完成功能正在使用的印象。如果结果正是他们需要的，那就太好了！如果他们想搜索其他地点，请设置自动完成功能以监听 place_changed 并运行 autocomplete.getPlace()，然后执行相同的回调。