Javascript 存储谷歌地图多条路线的距离和持续时间

我无法存储从google maps api获取的多条路线的距离和持续时间，我可以存储第一条路线的距离和持续时间，但我需要地图中所有备选路线的距离和持续时间。以下是代码： 身体 { 字体系列：Arial； 字号：10pt； } var来源、目的地； 变量方向显示；//整个地图的渲染或显示

        var directionsService = new google.maps.DirectionsService();  // For Availing the Direction Services provided by APIs

        google.maps.event.addDomListener(window, 'load', function () {              //  This acts as a pageload Function    
            new google.maps.places.SearchBox(document.getElementById('txtSource'));
            new google.maps.places.SearchBox(document.getElementById('txtDestination'));
            directionsDisplay = new google.maps.DirectionsRenderer({ 'draggable': true });
        });

        function GetRoute()
        {
            var kolkata = new google.maps.LatLng(22.7383075, 88.454424);  // Center of the Map
            var mapOptions =
        {              // Setting the View of the Map
                zoom: 7,
                center: kolkata
            };

            map = new google.maps.Map(document.getElementById('dvMap'), mapOptions);   // Variable for map view

            directionsDisplay.setMap(map);                              // Map view

            directionsDisplay.setPanel(document.getElementById('dvPanel'));  //Panel View

            //------------------------------DIRECTIONS AND ROUTE------------------------------------------------------

            source = document.getElementById("txtSource").value;
            destination = document.getElementById("txtDestination").value;

            var request =                       
        {                                   // DirectionsService
                origin: source,
                destination: destination,
        provideRouteAlternatives: true,
                travelMode: google.maps.TravelMode.DRIVING
            };

            directionsService.route(request, function (response, status)
        {                  // RouteService
                if (status == google.maps.DirectionsStatus.OK) 
        {
                    directionsDisplay.setDirections(response);
                }
        });

            //-----------------------------DISTANCE AND DURATION----------------------------------------------------

            var service = new google.maps.DistanceMatrixService();          // Different Services Provided by APIs
            service.getDistanceMatrix({
                origins: [source],
                destinations: [destination],
                travelMode: google.maps.TravelMode.DRIVING,
                unitSystem: google.maps.UnitSystem.METRIC,
                avoidHighways: false,
                avoidTolls: false
            }, function (response, status) {
                if (status == google.maps.DistanceMatrixStatus.OK && response.rows[0].elements[0].status != "ZERO_RESULTS") {
                    var distance = response.rows[0].elements[0].distance.text;    //  Distance Calculation From data provide by APIs
                    var duration = response.rows[0].elements[0].duration.text;      //  Duration Calculation From data provide by APIs
                    var dvDistance = document.getElementById("dvDistance");         // This Variable is for Fetching the Routes distance and displaying it on web page.
                    dvDistance.innerHTML = "";
                    dvDistance.innerHTML += "Distance: " + distance + "<br />";
                    dvDistance.innerHTML += "Duration:" + duration;

                    // Here's your AJAX request
                    var httpRequest;
                    if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+ ...
                        httpRequest = new XMLHttpRequest();
                    } else if (window.ActiveXObject) { // IE 6 and older
                        httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
                    }
                    httpRequest.onreadystatechange = function() {
                        if (httpRequest.readyState == 4 && httpRequest.status == 200) {
                            alert(httpRequest.responseText);
                        }
                    };
                    httpRequest.open("POST", "saveDetails.php", true);
                    httpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
                    httpRequest.send("&source=" + source + "&destination=" + destination + "&distance=" + distance + "&duration=" + duration);  

                } else {
                    alert("Unable to find the distance via road.");
                }
            });
        }
    </script>   
    <table border="0" cellpadding="0" cellspacing="3">
        <tr>
            <td colspan="2">
                Source:
                <input type="text" id="txtSource"  style="width: 200px" />
                &nbsp; Destination:
                <input type="text" id="txtDestination" style="width: 200px" />
                &nbsp; Travel Mode:
                <select>
                    <option value="1" selected>Driving</option>
                    <option value="2">Cycling</option>
                    <option value="3">Transit</option>
                    <option value="4">Walking</option>
                </select>
                <br/>
                <input type="button" value="Get Route" onclick="GetRoute()" />
                <hr />
            </td>
        </tr>
        <tr>
            <td colspan="2">
                <div id="dvDistance">
                </div>
            </td>
        </tr>
        <tr>
            <td>
                <div id="dvMap" style="width: 800px; height: 500px">
                </div>
            </td>
            <td>
                <div id="dvPanel" style="width: 500px; height: 500px">
                </div>
            </td>
        </tr>
    </table>
    <br>
</body>

var directionservice=new google.maps.directionservice（）；//利用API提供的方向服务
google.maps.event.addDomListener（窗口'load'，函数（）{//
新的google.maps.places.SearchBox（document.getElementById（'txtSource'）；
新的google.maps.places.SearchBox（document.getElementById（'txtDestination'）；
directionsDisplay=new google.maps.DirectionsRenderer（{'Dragable'：true}）；
});
函数GetRoute（）
{
var kolkata=new google.maps.LatLng（22.738307588.454424）；//地图中心
var映射选项=
{//设置地图的视图
缩放：7，
中心：加尔各答
};
map=new google.maps.map（document.getElementById（'dvMap'），mapOptions）；//用于地图视图的变量
directionsDisplay.setMap（地图）；//地图视图
directionsDisplay.setPanel（document.getElementById（'dvPanel'）；//面板视图
//------------------------------方向和路线------------------------------------------------------
source=document.getElementById（“txtSource”）.value；
destination=document.getElementById（“txtDestination”）.value；
var请求=
{//DirectionsService
来源：来源：，
目的地：目的地，
ProviderRouteAlternatives:正确，
travelMode:google.maps.travelMode.DRIVING
};
路由（请求、功能（响应、状态）
{//路由服务
if（status==google.maps.directionstatus.OK）
{
方向显示。设置方向（响应）；
}
});
//-----------------------------距离和持续时间----------------------------------------------------
var service=new google.maps.DistanceMatrixService（）；//API提供的不同服务
service.getDistanceMatrix({
来源：[来源]，
目的地：[目的地]，
travelMode:google.maps.travelMode.DRIVING，
unitSystem:google.maps.unitSystem.METRIC，
避免：错误，
避免收费：错误
}，功能（响应、状态）{
if（状态==google.maps.DistanceMatrixStatus.OK&&response.rows[0]。元素[0]。状态！=“零结果”）{
var distance=response.rows[0]。元素[0]。distance.text；//根据API提供的数据计算距离
var duration=response.rows[0]。元素[0]。duration.text；//根据API提供的数据计算持续时间
var dvDistance=document.getElementById（“dvDistance”）；//此变量用于获取路线距离并将其显示在网页上。
dvDistance.innerHTML=“”；
dvDistance.innerHTML+=“距离：”+Distance+“
”；
dvDistance.innerHTML+=“持续时间：”+持续时间；
//这是您的AJAX请求
var-httpRequest；
如果（window.XMLHttpRequest）{//Mozilla、Safari、IE7+。。。
httpRequest=新的XMLHttpRequest（）；
}else如果（window.ActiveXObject）{//IE 6及更早版本
httpRequest=新的ActiveXObject（“Microsoft.XMLHTTP”）；
}
httpRequest.onreadystatechange=函数（）{
if（httpRequest.readyState==4&&httpRequest.status==200）{
警报（httpRequest.responseText）；
}
};
open（“POST”，“saveDetails.php”，true）；
setRequestHeader（“内容类型”，“应用程序/x-www-form-urlencoded”）；
httpRequest.send（“&source=“+source+”&destination=“+destination+”&distance=“+distance+”&duration=“+duration”）；
}否则{
警报（“无法通过道路找到距离”）；
}
});
}
资料来源：
目的地：
出行方式：
驱动
骑脚踏车兜风
换乘
行走

php文件如下：
and the php file is here:

<?php
$link = mysqli_connect("127.0.0.1", "root", "", "testdb");
        if (!$link) 
        {
            echo "Error: Unable to connect to MySQL." . PHP_EOL;
            echo "Debugging errno: " . mysqli_connect_errno() . PHP_EOL;
            echo "Debugging error: " . mysqli_connect_error() . PHP_EOL;
            exit;
        }

        echo "Success: A proper connection to MySQL was made! The testdb database is great." . PHP_EOL;
        echo "<br/>";
        echo "Host information: " . mysqli_get_host_info($link) . PHP_EOL;
        echo "<br/>";

        $source = $_POST['source'];
        $destination = $_POST['destination'];
        $distance = $_POST['distance'];
        $duration = $_POST['duration'];
        if(isset($_POST['source']) && isset($_POST['destination']) && isset($_POST['distance']) && isset($_POST['duration']))
        {
            $sql="INSERT INTO trip(source,destination,distance,duration) VALUES('$source', '$destination', '$distance', '$duration')";
        }                                                                                                            
        $result = mysqli_query($link,$sql); 
        if($result) 
        {
            echo "Successfully updated database";
        } 
        else 
        { 
            die('Error: '.mysqli_error($link));
        } 
        mysqli_close($link);


?>