从地点获取街道号码 API
Getting street number from Places API
我正在使用 Google 地点 API 使输入目的地变得容易。理想情况下,我希望用户能够开始输入语义名称(例如斯坦福大学)并让 Places API 自动建议一个选项。我正在使用 Geocoder 返回的结果来获取结构化位置数据。但是,我注意到如果我输入 "Stanford University" 的查询,返回的地理编码结果不包含 street_number 的键。有谁知道如何使用 Places API 将地点地理编码为包含 street_number 的地理编码结果?
如果我查找 Stanford University with the places service,它 returns place_id
ChIJneqLZyq7j4ARf2j8RBrwzSk
。 getDetails
请求 place_id
returns 地址组件数组,条目类型为 street_number
。
代码片段:
var map;
var infowiandow;
var service;
var data_id;
var count = 1;
var request;
var placeIDs = [];
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(19.12455, 72.929158),
zoom: 11
});
infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
var errorCnt = 0;
var successCnt = 0;
for (var i = 0; i < data.length; i++) {
placeIDs[i] = data[i]['place_id'];
infoWindow = new google.maps.InfoWindow();
service = new google.maps.places.PlacesService(map);
service.getDetails({
placeId: placeIDs[i]
}, function (place, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
successCnt += 1;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
title: place.name
});
for (var i = 0; i < place.address_components.length; i++) {
for (var j = 0; j < place.address_components[i].types.length; j++) {
if (place.address_components[i].types[j] == "street_number") {
document.getElementById('info').innerHTML += "street_number:" + place.address_components[i].long_name + "<br>";
}
}
}
console.log(place);
bounds.extend(marker.getPosition());
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(place.name + "<br>" + place.types + "<br><a href='" + place.url + "'>url</a>");
infowindow.open(map, this);
});
document.getElementById('success').innerHTML += "placename=" + place.name + " successCnt=" + successCnt + "<br>";
map.fitBounds(bounds);
} else {
document.getElementById('info').innerHTML += "[" + errorCnt + "] status=" + status + " successCnt=" + successCnt + "<br>";
errorCnt += 1;
}
});
}
/* }); */
}
var data = [{
place_id: "ChIJneqLZyq7j4ARf2j8RBrwzSk"
}];
google.maps.event.addDomListener(window, 'load', initialize);
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="success"></div>
<div id="info"></div>
<div id="map-canvas"></div>
<h4 id="place_id"></h4>
我正在使用 Google 地点 API 使输入目的地变得容易。理想情况下,我希望用户能够开始输入语义名称(例如斯坦福大学)并让 Places API 自动建议一个选项。我正在使用 Geocoder 返回的结果来获取结构化位置数据。但是,我注意到如果我输入 "Stanford University" 的查询,返回的地理编码结果不包含 street_number 的键。有谁知道如何使用 Places API 将地点地理编码为包含 street_number 的地理编码结果?
如果我查找 Stanford University with the places service,它 returns place_id
ChIJneqLZyq7j4ARf2j8RBrwzSk
。 getDetails
请求 place_id
returns 地址组件数组,条目类型为 street_number
。
代码片段:
var map;
var infowiandow;
var service;
var data_id;
var count = 1;
var request;
var placeIDs = [];
function initialize() {
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: new google.maps.LatLng(19.12455, 72.929158),
zoom: 11
});
infowindow = new google.maps.InfoWindow();
var bounds = new google.maps.LatLngBounds();
var errorCnt = 0;
var successCnt = 0;
for (var i = 0; i < data.length; i++) {
placeIDs[i] = data[i]['place_id'];
infoWindow = new google.maps.InfoWindow();
service = new google.maps.places.PlacesService(map);
service.getDetails({
placeId: placeIDs[i]
}, function (place, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
successCnt += 1;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
title: place.name
});
for (var i = 0; i < place.address_components.length; i++) {
for (var j = 0; j < place.address_components[i].types.length; j++) {
if (place.address_components[i].types[j] == "street_number") {
document.getElementById('info').innerHTML += "street_number:" + place.address_components[i].long_name + "<br>";
}
}
}
console.log(place);
bounds.extend(marker.getPosition());
google.maps.event.addListener(marker, 'click', function () {
infowindow.setContent(place.name + "<br>" + place.types + "<br><a href='" + place.url + "'>url</a>");
infowindow.open(map, this);
});
document.getElementById('success').innerHTML += "placename=" + place.name + " successCnt=" + successCnt + "<br>";
map.fitBounds(bounds);
} else {
document.getElementById('info').innerHTML += "[" + errorCnt + "] status=" + status + " successCnt=" + successCnt + "<br>";
errorCnt += 1;
}
});
}
/* }); */
}
var data = [{
place_id: "ChIJneqLZyq7j4ARf2j8RBrwzSk"
}];
google.maps.event.addDomListener(window, 'load', initialize);
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="success"></div>
<div id="info"></div>
<div id="map-canvas"></div>
<h4 id="place_id"></h4>