Google地图距离矩阵 - 使用原点和目的地之间的距离计算旅行区

时间:2017-11-16 01:17:54

标签: jquery google-maps google-distancematrix-api

使用Google地图距离矩阵我有两个位置之间的距离,我想用这个距离来确定旅行区。

我写的当前脚本计算并输出距离,我需要帮助才能找到旅行区。

jQuery已启用。

<script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCkUOdZ5y7hMm0yrcCQoCvLwzdM6M8s5qk&callback=initMap">
</script>

     <script type="text/javascript">
        var origin = 'Perth, Australia',
            destination = 'Two Rocks, Australia',
            service = new google.maps.DistanceMatrixService(),
            zone;

        service.getDistanceMatrix(
            {
                origins: [origin],
                destinations: [destination],
                travelMode: google.maps.TravelMode.DRIVING,
                avoidHighways: false,
                avoidTolls: false
            }, 
            callback
        );

        function callback(response, status) {
            var orig = document.getElementById("orig"),
                dest = document.getElementById("dest"),
                dist = document.getElementById("dist");
                zone = document.getElementById("zone");

            if(status=="OK") {
                orig.value = response.destinationAddresses[0];
                dest.value = response.originAddresses[0];
                dist.value = response.rows[0].elements[0].distance.text;
            } else {
                alert("Error: " + status);
            }

            if (dist <= 30) {
                zone = 1;
            } else if (dist >= 30 && dist < 60) {
                zone = 2;
            } else if (dist >= 60 && dist < 90) {
                zone = 3;
            } else if (dist >= 90 && dist <= 120) {
                zone = 4;
            } else {
                zone = 'Out of range';
            }
        }

        </script>

        <label>
            <input id="orig" type="hidden"/>
            <input id="dest" type="hidden" />

            Distance: <input id="dist" type="text" value="distance" />
            Travel Zone: <input id="zone" type="text" value="zone" />

        </label>

1 个答案:

答案 0 :(得分:0)

设置变量,确保将距离作为数字(不附加km)

    <script src='https://maps.googleapis.com/maps/api/js?key=key'></script>

    <script type="text/javascript">
    var origin = 'Perth, Australia',
        destination = '<?php echo $suburb; ?>, Australia',
        service = new google.maps.DistanceMatrixService();

    service.getDistanceMatrix(
        {
            origins: [origin],
            destinations: [destination],
            travelMode: google.maps.TravelMode.DRIVING,
            avoidHighways: false,
            avoidTolls: false
        }, 
        callback
    );

    function callback(response, status) {
        var orig = document.getElementById("orig"),
            dest = document.getElementById("dest"),
            dist = document.getElementById("dist"),
            zone = document.getElementById("zone");
            total = document.getElementById("total");

        if(status=="OK") {
            orig.value = response.destinationAddresses[0];
            dest.value = response.originAddresses[0];
            // return distance in metres
            dist.value = response.rows[0].elements[0].distance.value;

            // Use dist.value to calculate travel zone
            if (dist.value <= 30000) {
                zone.value = 0;
            } else if (dist.value >= 30000 && dist.value < 40000) {
                zone.value = 20;
            } else if (dist.value >= 40000 && dist.value < 50000) {
                zone.value = 40;
            } else if (dist.value >= 50000 && dist.value <= 60000) {
                zone.value = 80;
            } else if (dist.value >= 60000 && dist.value <= 70000) {
                zone.value = 150;
            } else if (dist.value >= 70000 && dist.value <= 80000) {
                zone.value = 190;
            } else {
                zone.value = 'Out of range';
            }
            total.value = Number(<?php echo $base; ?>) + Number(zone.value);

        } else {
            dist.value = 'Unknown Suburb';
        }


    }

    </script>

输出变量:

<input id="orig" type="text"/>
<input id="dest" type="text" />
<input id="dist" type="text" />
<input id="zone" type="text" />