دریافت فاصله در گوگل مپ

0 امتیاز
198 بازدید
سوال شده اردیبهشت 31, 1395 توسط a,minfc  

سلام من میخوام فاصله دو شهر رو به کیلومتر به تنهایی به دست بیارم یه کد یدا کردم اما هر چی بین متغیرهاش می گردم نمی دونم چیکار کنم میخوام متغیر 

کیلومتر به تنهایی و به عدد انگلیسی به دست بیاد که من بتونم اونو تو فرمولام استفاده کنم اگر بتونم این متغیر رو به صروت php به دست بیارم بهتره

<!DOCTYPE html>
<html>
<head>

   <html lang="fa"  dir="rtl">
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">
    <meta charset="utf-8">
    <title>Waypoints in directions</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="style.css" rel="stylesheet">
    <style>
        html, body, #map-canvas {
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyDlOA0kfEdoq8TnAZl7K1XBgBsAKRopbYY&language=fa"></script>

    <script>

        var directionsDisplay;
        var directionsService = new google.maps.DirectionsService();

        function initialize() {
            directionsDisplay = new google.maps.DirectionsRenderer();
            var yazd = new google.maps.LatLng(32.142007, 55.000542);
            var mapOptions = {
                zoom: 6,
                center: yazd
            }
            var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
            directionsDisplay.setMap(map);

        }


        function calcRoute() {
            var start = document.getElementById('start').value;
            var end = document.getElementById('end').value;
            var waypts = [];


            var request = {
                origin: start,
                destination: end,
                waypoints: waypts,
                optimizeWaypoints: true,
                travelMode: google.maps.TravelMode.DRIVING
            };
            directionsService.route(request, function(response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(response);
                    /*alert(directionsDisplay.getDirections().routes[0].legs[2].start_address);
                    alert(directionsDisplay.getDirections().routes[0].legs[2].end_address);
                    alert(directionsDisplay.getDirections().routes[0].legs[2].distance.text);
                    alert(directionsDisplay.getDirections().routes[0].legs[2].duration.text);
                    alert(directionsDisplay.getDirections().routes[0].copyrights);
                    alert(directionsDisplay.getDirections().routes[0].legs[2].steps[0].instructions);
                    alert(directionsDisplay.getDirections().routes[0].legs[2].steps[0].distance.text);*/
                    var route = response.routes[0];
                    var summaryPanel = document.getElementById('directions_panel');
                    summaryPanel.innerHTML = '';
                    // For each route, display summary information.
                    for (var i = 0; i < route.legs.length; i++) {
                        var routeSegment = i + 1;
                        summaryPanel.innerHTML += '<b>بخش مسیر: ' + routeSegment + '</b><br>';
                        summaryPanel.innerHTML += route.legs[i].start_address + ' به ';
                        summaryPanel.innerHTML += route.legs[i].end_address + '<br>';
                        summaryPanel.innerHTML += route.legs[i].distance.text + '<br><br>';

                    }
                }
            });
        }



        google.maps.event.addDomListener(window, 'load', initialize);


    </script>
</head>
<body>
<div id="map-canvas" style="float:left;width:70%;height:100%;"></div>

<div id="control_panel" style="float:right;width:30%;text-align:center;padding-top:50px;direction: rtl;">
    <div style="margin:20px;">

        <form action="" method="post">
          <b>مبدأ:</b>  <input type="text" id="start" name="start"/>

        <br>
        <br>
        <b>مقصد:</b>
        <input type="text" id="end"/>
      </form>

        <br>
        <input type="submit" name="btn" value="نمایش مسیر" onclick="calcRoute();">
    </div>
    <div id="directions_panel" style="margin:50px;background-color:#FFEE77;"></div>
    <script>
 document.write(getElementById("control_panel"))
    </script>
</div>
</body>
</html>

 

این مطلب را به اشتراک بگذارید

1 پاسخ

0 امتیاز
پاسخ داده شده اردیبهشت 31, 1395 توسط ASHKARAN  
summaryPanel.innerHTML += route.legs[i].distance.text + '<br><br>';

این کد فاصله رو به شما میده که می تونید  با کمی تغییر String ورودی عدد رو ازش بیرون بکشید

دارای دیدگاه اردیبهشت 31, 1395 توسط a,minfc  
والا منم متوجه شدم ولی هر چی روش زور میزنم به جواب نمیرسم

977 سوال

819 پاسخ

1,329 دیدگاه

1,273 کاربر

متاسفانه نیستم

این مطلب را به اشتراک بگذارید

ali.ashkaran@gmail
ما .....
  • سعی بر پاسخگویی به سوالات دیگران داریم.
  • به سوال و یا نظر دیگران احترام می گذاریم .
  • این وبسایت را به دیگران معرفی می کنیم.
  • همواره صمیمیت و ادب را رعایت می کنیم.
  • به سوالمان برچسب های مرتبط اضافه می کنیم.
  • در حین طرح سوال فرد خاصی را مخاطب قرار نمی دهیم .
...