2016-01-04 2 views
1

Я получил значение Широта и долготу для этого кода, здесь, после того, как я хочу показать направление адреса FROM в адрес TO, я не знаю, как помочь ...Как показать направление От адреса до адреса

<script type="text/javascript"> 
 
     window.onload = function() { 
 
      var mapOptions = { 
 
       center: new google.maps.LatLng(12.9715987, 77.59456269999998),//FROM address Latitude , Longitude value 
 
       zoom: 14, 
 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
 
      }; 
 
      var infoWindow = new google.maps.InfoWindow(); 
 
      var latlngbounds = new google.maps.LatLngBounds(); 
 
      var map = new google.maps.Map(document.getElementById("dvMap"), mapOptions); 
 
      google.maps.event.addListener(map, 'click', function (e) { 
 
       alert("Latitude: " + e.latLng.lat() + "\r\nLongitude: " + e.latLng.lng());// i got TO address Latitude , Longitude value 
 
      }); 
 
     } 
 
    </script>
<div id="dvMap" style="width: 300px; height: 300px">

+0

вы хотите направления движения делать? Если да, [этот вопрос] (https://stackoverflow.com/questions/5959788/google-maps-api-v3-how-show-the-direction-from-a-point-a-to-point-b- blue-line? rq = 1). –

+0

Я уже видел этот пример, этот, если мы нажимаем на карту google, означает, что он приближается к масштабированию, для меня это не нужно, я хочу показать направление щелчка по месту –

+0

Было бы полезно, если бы вы могли свяжите нас с примером того, чего вы хотите достичь. Вы также можете попытаться прояснить вопрос. –

ответ

0

Привет Это один будет полезно для вас, Малый Пример Direction службы, я использую центральную точку FROM адрес и адрес где вы когда-либо щелкнув по нему будет принимает к адресу , карта нарисует корень движения.

<!DOCTYPE html> 
    <html> 
     <head> 
     <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> 
     <meta charset="utf-8"> 
     <title>Google Maps JavaScript API v3 Example: Directions Travel Modes</title> 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
     <script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 
     <input type="text" id="from_Latlng" value="12.9301397, 77.58773180000003" /> 
     <input type="text" id="to_Latlng" value="" /> 
     <script> 
     $(function(){ initialize(); }); 
      var directionDisplay; 
      var directionsService = new google.maps.DirectionsService(); 
      var map; 

     function initialize() { 

      var From = new google.maps.LatLng(12.9301397, 77.58773180000003); 
      var to_latLng=$("#to_Latlng").val(); 
      if(to_latLng!='') 
      { 
       var to_LatLngSplit=to_latLng.split(","); 
       var to_lat=to_LatLngSplit[0]; 
       var to_lng=to_LatLngSplit[1]; 
       var to = new google.maps.LatLng(to_lat,to_lng); 
      } 
      else 
      { 
      var to = new google.maps.LatLng(12.9997841, 77.68394269999999); 
      } 
      directionsDisplay = new google.maps.DirectionsRenderer(); 
      var mapOptions = { 
       zoom: 14, 
       mapTypeId: google.maps.MapTypeId.ROADMAP, 
       center: From 
      } 
      map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions); 
      // If there are any parameters at eh end of the URL, they will be in location.search 
      var lat,lng,zoom,type; 
      //looking something like "?marker=3" 
      directionsDisplay.setMap(map); 
      calcRoute(From,to); 

       google.maps.event.addListener(map, 'click', function (e) { 
        //alert("Latitude: " + e.latLng.lat() + "\r\nLongitude: " + e.latLng.lng());// i got TO address Latitude , Longitude value 
        $('#to_Latlng').val(e.latLng.lat()+","+e.latLng.lng()); 
        initialize(); 
       }); 

     } 

      function calcRoute(From,to) { 
      var selectedMode = "DRIVING"; 
      var request = { 
       origin: From, 
       destination: to, 
       travelMode: google.maps.TravelMode[selectedMode] 
      }; 
      directionsService.route(request, function(response, status) { 
       if (status == google.maps.DirectionsStatus.OK) { 
       directionsDisplay.setDirections(response); 
       } else { 
       alert("Directions Request Failed, "+status); 
       } 
      }); 
      } 
     </script> 
     </head> 
     <body onload="initialize()"> 
     <div> 
     <b>Mode of Travel: </b> 
     </div> 
     <div id="map_canvas" style="height: 450px;"></div> 
     </body> 
    </html> 

Demo

+0

Я хочу, чтобы этот ответ, ваша демонстрация будет работать нормально, я копирую один и тот же код, но не работает для меня, onclick означает, что ничего не произойдет –

+0

[link] (https://developers.google.com/maps/documentation/javascript/examples/directions-travel-modes). можете ли вы пройти через картографическую карту маршрутов карты Google. –

Смежные вопросы