我使用谷歌自动完成地方javascript为我的搜索框返回建议的结果,我需要的是只显示城市和国家相关的字符输入,但谷歌api会给很多一般地方的结果,我不需要,所以如何限制结果只显示城市和国家。
我使用下面的例子:
<html>
<head>
<style type="text/css">
body {
font-family: sans-serif;
font-size: 14px;
}
</style>
<title>Google Maps JavaScript API v3 Example: Places Autocomplete</title>
<script src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places" type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div>
<input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on">
</div>
</body>
</html>
try this
<html>
<head>
<style type="text/css">
body {
font-family: sans-serif;
font-size: 14px;
}
</style>
<title>Google Maps JavaScript API v3 Example: Places Autocomplete</title>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false&libraries=places®ion=in" type="text/javascript"></script>
<script type="text/javascript">
function initialize() {
var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div>
<input id="searchTextField" type="text" size="50" placeholder="Enter a location" autocomplete="on">
</div>
</body>
</html>
http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places“ type=”text/javascript”
将其更改为:"region=in" (in=india)
“http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places®ion=in” type=“text/javascript”
我一直在玩谷歌自动补全API有点,这是我能找到的最好的解决方案,限制你的结果只有国家:
var autocomplete = new google.maps.places.Autocomplete(input, options);
var result = autocomplete.getPlace();
console.log(result); // take a look at this result object
console.log(result.address_components); // a result has multiple address components
for(var i = 0; i < result.address_components.length; i += 1) {
var addressObj = result.address_components[i];
for(var j = 0; j < addressObj.types.length; j += 1) {
if (addressObj.types[j] === 'country') {
console.log(addressObj.types[j]); // confirm that this is 'country'
console.log(addressObj.long_name); // confirm that this is the country name
}
}
}
如果您查看返回的结果对象,您将看到有一个address_components数组,它将包含表示地址的不同部分的几个对象。在这些对象中,它将包含一个'types'数组,在这个'types'数组中,您将看到与地址相关的不同标签,包括一个国家。
弗朗索瓦给出的答案是列出一个国家的所有城市。但如果要求列出一个国家的所有地区(城市+州+其他地区等)或该国的机构,则可以通过更改类型相应地过滤结果。
只列出国内的城市
var options = {
types: ['(cities)'],
componentRestrictions: {country: "us"}
};
列出国内所有的城市、州和地区
var options = {
types: ['(regions)'],
componentRestrictions: {country: "us"}
};
列出这个国家所有的机构,比如餐馆、商店和办公室
var options = {
types: ['establishment'],
componentRestrictions: {country: "us"}
};
同样,你可以像这样向结果过滤器添加多种类型:
列出所有相当于学校和药店的机构,以及社区、地点和次地点的类型
var options = {
types: ['school','drugstore','neighborhood', 'locality', 'sublocality'],
componentRestrictions: {country: "us"}
};
注意:查看可用的类型,并注意只能组合表1和表2中的项目,最多可以组合5个项目。表3不允许结合。
更多信息和选项可在
https://developers.google.com/maps/documentation/javascript/places-autocomplete
希望这对别人有用
基本与公认的答案相同,但更新了新的类型和多个国家的限制:
function initialize() {
var options = {
types: ['(regions)'],
componentRestrictions: {country: ["us", "de"]}
};
var input = document.getElementById('searchTextField');
var autocomplete = new google.maps.places.Autocomplete(input, options);
}
使用“(地区)”而不是“(城市)”可以通过邮政编码和城市名称进行搜索。
见官方文件,表3:
https://developers.google.com/places/supported_types