Question

我已经尝试过这么多方法仍然无法弄清楚为什么这个计算没有通过，我使用谷歌距离计算来计算距离然后计算票价。任何有关这方面的帮助将不胜感激。

<table border="0" cellpadding="0" cellspacing="3">
<tr>
    <td colspan="2">
        Source:
        <input type="text" id="txtSource" value="heathrow terminal 5" style="width: 300px" />
        &nbsp; Destination:
        <input type="text" id="txtDestination" value="bath road, tw6" style="width: 300px" />
        <br />
        



        <input type="button" id="calufare" runat="server"  value="Get Route" onclick="GetRoute()"/>
        <hr />
    </td>
</tr>
<tr>
    <td colspan="2">
        <asp:Label ID="dvDistance" runat="server" Text=""></asp:Label> 
        <asp:Label ID="dvDuration" runat="server" Text=""></asp:Label>
        <asp:TextBox ID="rate" runat="server" Text="2.5"></asp:TextBox>
        <asp:Label ID="Fareid" runat="server" Text="Price£  "></asp:Label>

        <script>

            
        </script>
    </td>
</tr>
<tr>
    <td>
        <div id="dvMap" style="width: 500px; height: 200px">
        </div>
    </td>
    <td>
        <div id="dvPanel" style="width: 500px; height: 200px">
        </div>
    </td>
</tr>
</table>

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&libraries=places"></script>
<script type="text/javascript">
    var source, destination;
    var directionsDisplay;
    var directionsService = new google.maps.DirectionsService();
    google.maps.event.addDomListener(window, 'load', function () {
        new google.maps.places.SearchBox(document.getElementById('txtSource'));
        new google.maps.places.SearchBox(document.getElementById('txtDestination'));
        directionsDisplay = new google.maps.DirectionsRenderer({ 'draggable': false });
    });

    function GetRoute() {
        var heathrow = new google.maps.LatLng(51.4711620, -0.4523710);
        var mapOptions = {
            zoom: 7,
            center: heathrow
        };
        map = new google.maps.Map(document.getElementById('dvMap'), mapOptions);
        directionsDisplay.setMap(map);

        //*               FOR PRICE CALCULATION                         * //


    





        //*********DIRECTIONS AND ROUTE**********************//
        source = document.getElementById("txtSource").value;
        destination = document.getElementById("txtDestination").value;

        var request = {
            origin: source,
            destination: destination,
            travelMode: google.maps.TravelMode.DRIVING
        };
        directionsService.route(request, function (response, status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(response);
            }
        });

        //*********DISTANCE AND DURATION**********************//
        var service = new google.maps.DistanceMatrixService();
        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;
                var duration = response.rows[0].elements[0].duration.text;
                var dvDistance = document.getElementById("dvDistance");
                dvDistance.innerHTML = "";
                dvDistance.innerHTML += "Distance: " + distance + "<br />";
                var dvDuration = document.getElementById("dvDuration");
                dvDuration.innerHTML = "";
                dvDuration.innerHTML += "Duration:" + duration;
                
                var distanceMeters = response.rows[0].elements[0].distance.value;
               var rate = document.getElementById('Fareid').value;

                rate=document.getElementById('Fareid').innerHTML = rate / 1000 * distanceMeters;

            } else {
                alert("Unable to find the distance via road.");
            }
        });
    }


</script>

Answer 1

此代码未返回数字：

var rate = document.getElementById('rate').value;

如果您使用费率的数值和距离的数值（例如response.rows[0].elements[0].distance.value;，这是以米为单位的距离），您将得到一个数字答案。

这给了我一个结果：

var distanceMeters = response.rows[0].elements[0].distance.value;
rate = 2.5;
document.getElementById('Fareid').innerHTML = rate * distanceMeters;

NaN错误代码有什么问题？

1 个答案: