AngularJS中的谷歌API的距离计算问题

问题描述:

我使用默认的Google API javascript来计算两个经度和纬度之间的距离。 这里是HTML和Angular JavaScript代码相同。AngularJS中的谷歌API的距离计算问题

<!doctype html> 
<html> 
<head> 
<title> AngularJS Tabs</title> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.min.js" ></script> 
<script src="/Test/AngularJS/JS1.js"></script> 
<script 
src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDY0kkJiTPVd2U7aTOAwhc9ySH6oHxOIYM&sensor=false"> 
</script> 
</head> 
<body data-ng-app="myApp" data-ng-controller="myCtrl"> 
<div data-ng-repeat = "x in data1 | orderBy:'Distance'"> 
{{x.Distance}}Km 
</div> 
</body> 
</html> 

角JS代码:

var app = angular.module("myApp", []); 

app.controller("myCtrl",function ($scope,$rootScope,$http) 
    { 



     alert ("IN"); 
     $scope.longitude ="72.865"; 
     $scope.latitude ="19.2290"; 
$scope.data1 =  [{"Latitude":"19.2285287999999994","Longitude":"72.8651116999999999","OfficeID":"34_NO","Distance": null}, 
      {"Latitude":"19.1802370000000018","Longitude":"72.8554148999999995","OfficeID":"37_ML","Distance": null}, 
      {"Latitude":"18.9288717999999996","Longitude":"72.822098699999998","OfficeID":"51_AI","Distance": null}, 
      {"Latitude":"19.1286862000000006","Longitude":"72.8677942000000058","OfficeID":"41_PN","Distance": null}, 
      {"Latitude":"19.1286862000000006","Longitude":"72.8677942000000058","OfficeID":"28_GAP","Distance": null}, 
      {"Latitude":"19.1921800000000005","Longitude":"72.9484999999999957","OfficeID":"36_NE","Distance": null}, 
      {"Latitude":"19.216841800000001","Longitude":"72.9744756999999993","OfficeID":"35_YP","Distance": null}, 
      {"Latitude":"19.230592399999999","Longitude":"72.8663173000000057","OfficeID":"33_GE","Distance": null}, 
      {"Latitude":"19.1589519999999993","Longitude":"72.8537749999999988","OfficeID":"39_NK","Distance": null}, 
      {"Latitude":"18.9346618999999983","Longitude":"72.8367776000000049","OfficeID":"50_TH","Distance": null}, 
      {"Latitude":"19.1252999999999993","Longitude":"72.9077000000000055","OfficeID":"42_KA","Distance": null}, 
      {"Latitude":"19.1252999999999993","Longitude":"72.9077000000000055","OfficeID":"43_KB","Distance": null} 
    ]; 



var c =0; 
    for(c=0; c<$scope.data1.length; c++) 
    { 

      gelDistance(parseFloat($scope.data1[c].Latitude).toFixed(3),parseFloat($scope.data1[c].Longitude).toFixed(3),c); 

} 



function gelDistance(Latitude,Longitude,c) { 

    var location1 = new google.maps.LatLng($scope.latitude,$scope.longitude); 

     var location2 = new google.maps.LatLng(Latitude,Longitude); 

      directionsService = new google.maps.DirectionsService(); 
      directionsDisplay = new google.maps.DirectionsRenderer(
      { 
      suppressMarkers: true, 
      suppressInfoWindows: true 
      }); 
      var request = { 
      origin: location1, 
      destination:location2, 
      travelMode: google.maps.DirectionsTravelMode.DRIVING 
      }; 


      directionsService.route(request, function(response, status) 
      { 

     // alert ('function'+c); 
     //  alert (request); 
      if (status == google.maps.DirectionsStatus.OK) 
      { 
       $scope.$apply(function(){ 
      // alert ('responce'+c); 
       $scope.distance=parseFloat(response.routes[0].legs[0].distance.text); 
       $scope.temp=$scope.Distance; 
       $scope.data1[c].Distance=$scope.distance; 

       }); 
      } 

      } 

     );      

    } ; 

    }); 

我从该代码得到的结果是:

1Km 
2.8Km 
7.8Km 
9.3Km 
13.4Km 
13.4Km 
27.1Km 
28Km 
36.1Km 
39.4Km 
Km 
Km 

行驶距离计算跳过了一些值。我可以知道这个原因,请telme我怎么解决这个问题。我刚刚给出了12个样本值,其中我有超过30到40个值的距离进行计算。

+0

我不确定这是否是问题,但您还没有定义您的'$ rootScope'。 – KayAnn 2015-02-11 03:03:38

+0

并且您还没有使用标准的依赖关系层次结构。我插入一个代码片段供你参考,它来自官方的Angular JS文档:https://docs.angularjs.org/guide/scope – KayAnn 2015-02-11 03:08:31

所以基本上这是应该的样子(如果你去的文档):

var app = angular.module("myApp", []); 
 

 
app.controller('myCtrl', ['$scope' , '$rootScope' , function ($scope,$rootScope,$http) 
 
    {

基本上,这个问题是不是我的代码。免费提供的Google API服务每秒只能处理10个请求。

因此,只有前10个请求得到服务与距离计算。

解决方法是在每个请求之间添加一个超时。