Google Maps API place.url返回“未定义”吗？

Question

I'm having trouble adding some of Google Places API data types to an info window that will display data when a user clicks on a marker on the map. I have included the following data types place.name , place.rating , place.vacinity and these will successfully display the name, rating, and address of the establishment in the info window. However when I try to add place.url to return the "URL of the official Google page for this place", it returns undefined . These establishments have the URL if I search them via Google so I know that there are URLs however it just cannot access them for some reason?

This is the Javascript code snippet that creates the marker and adds the info window to the listener that will be called when clicked.

    function createMarker(place) {

   infowindow = new google.maps.InfoWindow();
  var placeLoc = place.geometry.location;

  var reportmarker = new google.maps.Marker({
    map: map,
    position: place.geometry.location
  });

  markers.push(reportmarker);
  google.maps.event.addListener(reportmarker, 'click', function() {
    infowindow.setContent("<p>" + place.name + "<br />" + place.rating + "<br />" + place.vicinity + "<br />" + place.url+ "<br />" +"</p>");
    infowindow.open(map, this);
  });
}

Answer 1

In your Jsfiddle, you're using nearbySearch() which responses data without url information. You have to use getDetails() to get url.

It isn't very clear from the documentation, but only the PlaceDetails result includes the url.

 var map; var infowindow; function initMap() { var pyrmont = { lat: -33.867, lng: 151.195 }; map = new google.maps.Map(document.getElementById('map'), { center: pyrmont, zoom: 15 }); infowindow = new google.maps.InfoWindow(); var service = new google.maps.places.PlacesService(map); service.nearbySearch({ location: pyrmont, radius: 500, type: ['store'] }, callback); } function callback(results, status) { if (status === google.maps.places.PlacesServiceStatus.OK) { var service = new google.maps.places.PlacesService(map); for (var i = 0; i < results.length; i++) { var request = { placeId: results[i].place_id } service.getDetails(request, createMarker) } } else console.log("nearbySearch:"+status); } function createMarker(place, status) { if (status === google.maps.places.PlacesServiceStatus.OK) { var placeLoc = place.geometry.location; var marker = new google.maps.Marker({ map: map, position: place.geometry.location }); google.maps.event.addListener(marker, 'click', function() { infowindow.setContent(place.name + ": " + place.rating + ": " + place.url); infowindow.open(map, this); }); } else console.log("placeDetails:"+status); } $(function() { initMap() }) 

 #map { height: 100vh; } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script> <div id="map"></div>