【问题标题】:Google Distance Matrix need to return the value谷歌距离矩阵需要返回值
【发布时间】:2015-08-15 06:12:55
【问题描述】:

我已经使用谷歌距离矩阵api通过以下方式获取两个地理点的最短距离:

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
<script>

    var origin1 = new google.maps.LatLng(9.6667, 80.0000);
    var destinationA = new google.maps.LatLng(9.6689, 80.0059);



    function calculateDistances() {


        var service = new google.maps.DistanceMatrixService();
        service.getDistanceMatrix(
            {
                origins: [origin1],
                destinations: [destinationA],
                travelMode: google.maps.TravelMode.DRIVING,
                unitSystem: google.maps.UnitSystem.METRIC,
                avoidHighways: false,
                avoidTolls: false
            }, callback);

    }

    function callback(response, status) {
        if (status != google.maps.DistanceMatrixStatus.OK) {
            alert('Error was: ' + status);
        } else {
            var origins = response.originAddresses;


            for (var i = 0; i < origins.length; i++) {
                var results = response.rows[i].elements;
                for (var j = 0; j < results.length; j++) {
                    alert(results[j].distance.text);
                }
            }
        }
    }


</script>

在此代码上,我成功获得了最短距离。但是我需要在调用 calculateDistances() 方法时返回该值,而不是提醒该值。我该怎么做回调方法!。

【问题讨论】:

  • 回调意味着不为返回值执行
  • 我怎样才能把这个方法改成返回方法
  • 为什么需要“返回”数据? DirectionsMatrix 是异步的,你不能从它的回调函数中返回任何东西,你必须在回调函数中使用可用的数据。您还没有告诉使用您要如何处理返回的数据。
  • 我需要返回数据并将它们存储在一个数组中
  • 我在这里添加了一个基于 cmets 的更新答案,以防万一您仍然需要。祝你好运!

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


【解决方案1】:

Distance Matrix 服务是异步,因此,您需要传递一个callback 方法在请求完成时执行,以处理结果。但您可以考虑将异步 API 转换为 promises

以下示例演示了如何使用 jQuery 将 Distance Matrix 服务 API 转换为 Promise:

var origin1 = new google.maps.LatLng(9.6667, 80.0000);
var destinationA = new google.maps.LatLng(9.6689, 80.0059);



function calculateDistances(origins,destinations) {
            var service = new google.maps.DistanceMatrixService();
            var d = $.Deferred();
            service.getDistanceMatrix(
                {
                    origins: origins,
                    destinations: destinations,
                    travelMode: google.maps.TravelMode.DRIVING,
                    unitSystem: google.maps.UnitSystem.METRIC,
                    avoidHighways: false,
                    avoidTolls: false
                }, 
                function(response, status){
                  if (status != google.maps.DistanceMatrixStatus.OK) {
                     d.reject(status);
                  } else {
                     d.resolve(response);
                  }
                });
            return d.promise();
}

        


        calculateDistances([origin1],[destinationA])
           .done(function(response){

                var origins = response.originAddresses;

                for (var i = 0; i < origins.length; i++) {
                    var results = response.rows[i].elements;
                    for (var j = 0; j < results.length; j++) {
                        //console.log(results[j].distance.text);
                        document.getElementById('result').innerHTML += results[j].distance.text;
                    }
                }

           })
           .fail(function(status){
              document.getElementById('result').innerHTML = 'An error occured. Status: ' + status;
           });
<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?signed_in=true"></script>
<div id='result'/>

【讨论】:

    【解决方案2】:

    我会将一个数组作为一个全局变量,其中包含元素的数量以及一个全局变量。然后,在回调中我会增加元素的数量并将当前数组元素设置为距离。

    希望这能回答您的问题。祝你好运!

    【讨论】:

      猜你喜欢
      • 2014-12-14
      • 1970-01-01
      • 2017-12-13
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多