谷歌地图请求返回未定义的结果?

时间:2016-05-08 13:18:11

标签: google-maps google-maps-api-3

我正在尝试使用谷歌地图发布地点请求'放置API,但我的结果总是未定义?

有什么建议吗?我的其他函数能够正确初始化地图对象,我可以看到我的地图上没有这个地方函数的标记吗?

如果有人能在这个功能中发现错误,我将非常感激!

    $scope.placeRequest = function(map){
                var location = new google.maps.LatLng(39.6303225,-106.57294);
                var service = new google.maps.places.PlacesService(map);

                service.nearbySearch({
                    location: location,
                    radius: 5000,
                    types: ['lodging','art_gallery','restaurant','bar', 'spa','museum']
                }, callback());

                function callback(results, status) {
                console.log(results);
                    if (status == google.maps.places.PlacesServiceStatus.OK) {
                        for (var i = 0; i < results.length; i++) {
                            $scope.places.push(results[i]);
                        }
                    }
                };
            };

1 个答案:

答案 0 :(得分:0)

您的结果始终未定义,因为您错误地使用了callback参数。这种语法不正确,它调用callback函数并使用该调用的结果(null)作为回调函数:

service.nearbySearch({
    location: location,
    radius: 5000,
    types: ['lodging','art_gallery','restaurant','bar', 'spa','museum']
            }, callback());

应该是:

service.nearbySearch({
    location: location,
    radius: 5000,
    types: ['lodging','art_gallery','restaurant','bar', 'spa','museum']
            }, callback);

proof of concept fiddle

代码段

&#13;
&#13;
var geocoder;
var map;
var infowindow;
var $scope = {
  places: []
};

function initialize() {
  map = new google.maps.Map(
    document.getElementById("map_canvas"), {
      center: new google.maps.LatLng(37.4419, -122.1419),
      zoom: 13,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    });
  var location = new google.maps.LatLng(39.6303225, -106.57294);
  var service = new google.maps.places.PlacesService(map);
  infowindow = new google.maps.InfoWindow();

  service.nearbySearch({
    location: map.getCenter(),
    radius: 5000,
    types: ['lodging', 'art_gallery', 'restaurant', 'bar', 'spa', 'museum']
  }, callback);

  function callback(results, status) {
    console.log(results);
    if (status == google.maps.places.PlacesServiceStatus.OK) {
      for (var i = 0; i < results.length; i++) {
        console.log(results[i].name + ":" + results[i].geometry.location);
        $scope.places.push(results[i]);
        createMarker(results[i]);
      }
    } else alert("places request failed, status=" + status)
  };

  function createMarker(place) {
    var placeLoc = place.geometry.location;
    var marker = new google.maps.Marker({
      map: map,
      position: place.geometry.location,
      title: place.name
    });

    google.maps.event.addListener(marker, 'click', function() {
      infowindow.setContent(place.name);
      infowindow.open(map, this);
    });
  }
}

google.maps.event.addDomListener(window, "load", initialize);
&#13;
html,
body,
#map_canvas {
  height: 100%;
  width: 100%;
  margin: 0px;
  padding: 0px
}
&#13;
<script src="https://maps.googleapis.com/maps/api/js?libraries=geometry,places"></script>
<div id="map_canvas"></div>
&#13;
&#13;
&#13;