谷歌地图距离矩阵 - 使用出发地和目的地之间的距离计算旅行区域

Question

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

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

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>

Answer 1

设置变量，确保将距离作为数字(不附加 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" />