Google Place API-地点搜索分页
我需要你关于google place api的帮助，我在这里得到了示例代码：https://developers.google.com/maps/documentation/javascript/examples/place-search-pagination
它只显示地名(place.name)，但除了地名，我还想要place formatted_address，formatted_phone_number。https://developers.google.com/places/documentation/details
但是当我添加(place.formatted_address)时，它返回undefined。
我不太熟悉java-script，请帮我在同一脚本中显示地址和地名的详细信息：
developers.google.com/maps/documentation/javascript/examples/place-search-pagination
<code>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<title>Place search pagination</title>
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
<script>
var map, placesList;
function initialize() {
var pyrmont = new google.maps.LatLng(23.765698, 90.357581);
map = new google.maps.Map(document.getElementById('map-canvas'), {
center: pyrmont,
zoom: 17
});
var request = {
location: pyrmont,
radius: 500000,
types: ['bank']
};
placesList = document.getElementById('places');
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, callback);
}
function callback(results, status, pagination) {
if (status != google.maps.places.PlacesServiceStatus.OK) {
return;
} else {
createMarkers(results);
if (pagination.hasNextPage) {
var moreButton = document.getElementById('more');
moreButton.disabled = false;
google.maps.event.addDomListenerOnce(moreButton, 'click',
function() {
moreButton.disabled = true;
pagination.nextPage();
});
}
}
}
function createMarkers(places) {
var bounds = new google.maps.LatLngBounds();
for (var i = 0, place; place = places[i]; i++) {
var image = {
url: place.icon,
size: new google.maps.Size(71, 71),
origin: new google.maps.Point(0, 0),
anchor: new google.maps.Point(17, 34),
scaledSize: new google.maps.Size(25, 25)
};
var marker = new google.maps.Marker({
map: map,
icon: image,
title: place.name,
position: place.geometry.location
});
placesList.innerHTML += '<tr><td>' + place.geometry.location + '</td><td>' + place.name + '</td><td>' + place.formatted_address + '</td></tr>';
bounds.extend(place.geometry.location);
}
map.fitBounds(bounds);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<style>
#results {
font-family: Arial, Helvetica, sans-serif;
position: absolute;
right: 5px;
top: 0%;
margin-top: 15px;
height: 580px;
width: 500px;
padding: 5px;
z-index: 5;
border: 1px solid #999;
background: #fff;
overflow-y: scroll;
}
h2 {
font-size: 22px;
margin: 0 0 5px 0;
}
table {
list-style-type: none;
padding: 0;
margin: 0;
width: 100%;
}
tr {
background-color: #f1f1f1;
padding: 10px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
li:nth-child(odd) {
background-color: #fcfcfc;
}
#more {
width: 100%;
margin: 5px 0 0 0;
}
</style>
</head>
<body>
<div id="map-canvas"></div>
<div id="results">
<h2>Results</h2>
<table id="places"></table>
<button id="more">More results</button>
</div>
</body>
</html>
</code>回答 1
Stack Overflow用户
发布于 2014-12-24 13:30:35
Details API与Places API不同。
首先，您需要获取您所在位置的Place_id；其次，您可以在Details API中使用该Place_id来获取formatted_address
您也可以尝试使用“”，它也可能显示邮寄地址，尽管没有邮政编码。
https://stackoverflow.com/questions/27437818
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号