Google Places API - 地点详细信息请求未定义答案

【问题标题】：Google Places API - Places detail request undefinedGoogle Places API - 地点详细信息请求未定义
【发布时间】：2012-03-20 05:15:29
【问题描述】：

我正在尝试使用 Google Places Library 检索地点详细信息。当您单击地点标记时，我希望能够看到地址、名称、网站等。

我正在使用以下教程： http://code.google.com/apis/maps/documentation/javascript/places.html

一切似乎进展顺利。在我的标记中，我可以显示名称和评级，但地址、网站和电话号码都显示为“未定义”。这是因为 Google 没有我要求的关于这些地点的信息吗？还是我做错了什么？

这是我正在使用的代码：变量映射；变量信息窗口；

  function initialize() {
    var pyrmont = new google.maps.LatLng(-33.8665433, 151.1956316);

    map = new google.maps.Map(document.getElementById('map_canvas'), {
      mapTypeId: google.maps.MapTypeId.ROADMAP,
      center: pyrmont,
      zoom: 15
    });

    var request = {
      location: pyrmont,
      radius: 5000,
      types: ['bar']
    };
    infowindow = new google.maps.InfoWindow();
    service = new google.maps.places.PlacesService(map);
    service.search(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() {
      infowindow.setContent(place.name + "<br />" + place.formatted_address +"<br />" + place.website + "<br />" + place.rating + "<br />" + place.formatted_phone_number);
      infowindow.open(map, this);
    });
  }

任何帮助或想法将不胜感激。

干杯。

【问题讨论】：

标签： javascript google-places-api

【解决方案1】：

您正在执行地点搜索，它不会返回您正在使用的所有字段：

http://code.google.com/apis/maps/documentation/javascript/places.html#place_search_responses

为了获取地址、网站等，您还需要调用place.getDetails()，传递Place 的reference。见：

http://code.google.com/apis/maps/documentation/javascript/places.html#place_details_requests

大致上，您的代码将更改为：

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

【讨论】：

就是这样。太感谢了。非常感谢您的帮助。
没问题！很高兴我能帮忙:)
嗨..我面临同样的问题并尝试了这个解决方案。但无法获得结果。" service.getDetails(request, function(details, status)" 在哪里声明这个服务变量？我需要在创建标记函数中再次声明这个吗？
你好，塔库尔。 service 变量在initialize() 函数中定义为全局变量。代码见原问题：service = new google.maps.places.PlacesService(map);
这是我的问题stackoverflow.com/questions/47547932/… 的链接，我尝试了相同的代码，但没有找到位置、纬度等，并且标记弹出窗口也没有显示在它们自己的位置。它显示最后添加的标记上的所有标记。

【解决方案2】：

根据上面 Mikes 的响应，我建议将呼叫移至如下所示的侦听器中。这样，只有在用户单击标记时才会调用 API，而不是在渲染大量标记的情况下单击数百次。

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

    google.maps.event.addListener(marker, 'click', function() {
      service.getDetails(request, function(details, status) {
      infowindow.setContent(details.name + "<br />" + details.formatted_address +"<br />" + details.website + "<br />" + details.rating + "<br />" + details.formatted_phone_number);
      infowindow.open(map, this);
    });
});

}

【讨论】：