我正在尝试通过Google地方为每个标记获取多个值,它正在运行但由于某种原因,一半标记为细节提供了空值,我不确定原因。
function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});
var request = { reference: place.reference };
service.getDetails(request, function(details, status) {
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(details.name + "<br />" + details.formatted_address +"<br />" + details.website + "<br />" + details.rating + "<br />" + details.formatted_phone_number);
infowindow.open(map, this);
});
});
}
这是一个工作小提琴:http://jsfiddle.net/g6mjkLpx/
答案 0 :(得分:1)
您可能遇到了查询限制。您只应在单击标记时请求详细信息(并且为了避免信息窗口中的“未定义”文本,您应该在将字段添加到信息窗之前检查字段是否存在):
function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});
google.maps.event.addListener(marker, 'click', function (e) {
var request = {
reference: place.reference
};
service.getDetails(request, function (details, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
var infoContent = "";
if (details.name) infoContent += details.name + "<br />";
if (details.formatted_address) infoContent += details.formatted_address + "<br />";
if (details.website) infoContent += details.website + "<br />";
if (details.rating) infoContent += details.rating + "<br />";
if (details.formatted_phone_number) infoContent += details.formatted_phone_number + "<br>";
infowindow.setContent(infoContent);
} else {
infowindow.setContent("request failed, status=" + status);
}
infowindow.open(map, marker);
});
});
}
代码段:
var pyrmont = new google.maps.LatLng(-33.8665433, 151.1956316);
var map = new google.maps.Map(document.getElementById('map'), {
center: pyrmont,
zoom: 15
});
var request = {
location: pyrmont,
radius: 500,
types: ['store']
};
var infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request, callback);
function callback(results, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
createMarker(results[i]);
}
}
}
function createMarker(place) {
var placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location
});
google.maps.event.addListener(marker, 'click', function(e) {
var request = {
reference: place.reference
};
service.getDetails(request, function(details, status) {
if (status == google.maps.places.PlacesServiceStatus.OK) {
var infoContent = "";
if (details.name) infoContent += details.name + "<br />";
if (details.formatted_address) infoContent += details.formatted_address + "<br />";
if (details.website) infoContent += details.website + "<br />";
if (details.rating) infoContent += details.rating + "<br />";
if (details.formatted_phone_number) infoContent += details.formatted_phone_number + "<br>";
infowindow.setContent(infoContent);
} else {
infowindow.setContent("request failed, status=" + status);
}
infowindow.open(map, marker);
});
});
}
google.maps.event.addDomListener(window, 'load', initialize);
#map {
display: block;
width: 800px;
height: 400px;
}
<script src="http://maps.googleapis.com/maps/api/js?libraries=places"></script>
<div id="map"></div>