代码之家 › 专栏 › 技术社区 › Degsy

谷歌地图API位置。url返回“未定义”?

google-places-api google-maps-api-3 javascript

Degsy · 技术社区 · 8 年前

我在添加一些 Google Places API data types 当用户单击地图上的标记时,将显示数据的信息窗口。我已经包括了以下数据类型 place.name ,则, place.rating ,则, place.vacinity 这些将成功地在信息窗口中显示机构的名称、评级和地址。然而,当我尝试添加 place.url 要返回“此位置的官方谷歌页面URL”,它将返回 undefined 。如果我通过谷歌搜索这些机构,它们会有URL,因此我知道它们有URL,但它只是因为某种原因无法访问它们?

这是创建标记并将信息窗口添加到侦听器的Javascript代码段,单击该侦听器时将调用该窗口。

    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);
  });
}

1 回复 | 直到 8 年前

geocodezip 8 年前

在JSFIDLE中,您正在使用 nearbySearch() 它响应没有url信息的数据。你必须使用 getDetails() 获取url。

文档中不是很清楚,但只有 PlaceDetails result 包括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>