角谷歌地图缺少搜索功能

Question

我用的是ng-map api在我的项目，但我现在坚持，因为我想找到一个搜索功能，在那里我可以找到例如围绕一个特定的坐标的加油站，但我无法找到如果我应该继续使用这个库，那么任何人都可以帮助我并引导我。

Answer 1

你可以利用谷歌Places API的是的PlacesService.nearbySearch function：

检索附近的特定位置的地点列表，基于 关键字或类型。

下面的例子示出了如何发现和一定半径范围内显示加油站：

angular.module('mapApp', ['ngMap']) 
 

 
    .controller('mapController', function ($scope, NgMap, $http) { 
 

 
    $scope.location = [59.3260668,17.8419725]; 
 

 
    NgMap.getMap().then(function (map) { 
 
     $scope.map = map; 
 

 

 
     var service = new google.maps.places.PlacesService($scope.map); 
 
     var request = { 
 
     location: new google.maps.LatLng($scope.location[0], $scope.location[1]), 
 
     radius: '10000', 
 
     types: ['gas_station'] 
 
     }; 
 
     service.nearbySearch(request, $scope.displayResults); 
 
    }); 
 

 
    $scope.gasStations = []; 
 
    $scope.displayResults = function (results, status) { 
 
     if (status == google.maps.places.PlacesServiceStatus.OK) { 
 
     $scope.$apply(function() { 
 
      $scope.gasStations = results.map(function (item) { 
 
      return { 
 
       id: item.id, name: item.name, pos: [item.geometry.location.lat(), item.geometry.location.lng()] 
 
      }; 
 
      }); 
 
     }); 
 
     } 
 
    }; 
 

 

 
    });

<script src="https://code.angularjs.org/1.4.8/angular.js"></script> 
 
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script> 
 
<script src="https://rawgit.com/allenhwkim/angularjs-google-maps/master/build/scripts/ng-map.js"></script> 
 

 
<div ng-app="mapApp" ng-controller="mapController"> 
 
     
 
     <ng-map default-style="true" zoom="11" center="{{location}}"> 
 
      <marker ng-repeat="gs in gasStations" position="{{gs.pos}}" title="{{gs.name}}" id="{{gs.id}}"> 
 
      </marker> 
 
     </ng-map> 
 
</div>

Codepen