如何将 gmap 搜索自动完成功能限制为有限的国家/地区
How to limit gmap search autocomplete to limited country
我正在开发一个网站,我正在与设施一起实施Gmap。一切正常,但现在我只是希望它自动完成以限制在一个特定的国家/地区。这是我的代码。
$(document).ready(function() {
initialize_direction_map();
setDestination();
$("#start").autocomplete({
source: function(request, response) {
geocoder.geocode( {'address': request.term }, function(results, status) {
response($.map(results, function(item) {
return {
label: item.formatted_address,
value: item.formatted_address,
latitude: item.geometry.location.lat(),
longitude: item.geometry.location.lng()
}
}));
})
},
//This bit is executed upon selection of an address
select: function(event, ui) {
$("#s_latitude").val(ui.item.latitude);
$("#s_longitude").val(ui.item.longitude);
var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
map.setCenter(location);
map.setZoom(12);
var marker = new google.maps.Marker({
position: location,
map: map
});
document.getElementById('direction_box').style.display='block';
calcRoute();
}
});
$("#end").autocomplete({
//This bit uses the geocoder to fetch address values
source: function(request, response) {
geocoder.geocode( {'address': request.term }, function(results, status) {
response($.map(results, function(item) {
return {
label: item.formatted_address,
value: item.formatted_address,
latitude: item.geometry.location.lat(),
longitude: item.geometry.location.lng()
}
}));
})
},
//This bit is executed upon selection of an address
select: function(event, ui) {
$("#e_latitude").val(ui.item.latitude);
$("#e_longitude").val(ui.item.longitude);
var location = new google.maps.LatLng(ui.item.latitude, ui.item.longitude);
calcRoute();
$("table.adp-directions").css("width","300px");
}
});
});
function initialize_direction_map(){
//MAP
directionsDisplay = new google.maps.DirectionsRenderer();
var latlng = new google.maps.LatLng(20.5937,78.9629);
var options = {
zoom: 5,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'), options);
directionsDisplay.setMap(map);
directionsDisplay.setPanel(document.getElementById('directions-panel'));
//GEOCODER
geocoder = new google.maps.Geocoder();
}
您可以使用
Google Maps JavaScript API Places
库。借助 Google Places JavaScript 库中的函数,您的应用可以搜索已定义区域内的地点,例如地图边界或固定点周围的地点。
下面是如何按国家/地区限制的示例代码:
function initialize() {
var options = {
types: ['(cities)'],
componentRestrictions: {country: "us"}
};
var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input, options);
}
相关文章:
- Possibile使用Manifest v2下的HTML5地理位置API将lat/long转换为国家/地区
- 无法使用国家/地区选择中的状态动态填充下拉列表
- 在Chrome扩展中,我如何准确地检索用户'的地区/地区/国家
- 使用自动完成服务()将 Google 地图地点限制为特定国家/地区
- Magento:根据所选国家/地区隐藏/显示输入字段
- 仅在引导程序表单助手国家/地区选取器中显示国家/地区子集文本
- 如何从特定国家/地区重定向用户
- 根据国家/地区更改货币
- 如何将 gmap 搜索自动完成功能限制为有限的国家/地区
- 带有标志和文本的国家/地区建议列表
- 选择国家/地区时更改颜色
- 相对于选定的地区中心缩放SVG国家/地区地图
- Three.js地球仪-使国家/地区可点击
- 传递国家名称时获取所有州/地区/城市
- javascript从所选国家/地区值中选择城市
- 如何获得用户'的国家/地区,并转发到URL
- 下拉菜单,用于选择国家/地区,然后选择州
- 如果在JavaScript w/HTML中选择了特定国家/地区,如何要求邮政编码为数字
- 我如何限制谷歌地图API's的搜索框将搜索到一个国家/地区
- 以JSON格式Shopify地区(国家)