Join the social network of Tech Nerds, increase skill rank, get work, manage projects...
 
  • Google Map driving direction

    • 0
    • 0
    • 0
    • 0
    • 0
    • 0
    • 1
    • 0
    • 378
    Comment on it

    How to display the directions between to locations in google map?

    The easiest way for adding driving directions to the webpage is to create a map and then create a DIV for the directions panel, and fire off a query to it!

    Here's a very basic example using the v3 API:

    <!DOCTYPE html>
    <html> 
    <head> 
       <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 
       <title>Google Maps API v3 Directions Example</title> 
       <script type="text/javascript" 
               src="http://maps.google.com/maps/api/js?sensor=false"></script>
    </head> 
    <body style="font-family: Arial; font-size: 12px;"> 
       <div style="width: 600px;">
         <div id="map" style="width: 280px; height: 400px; float: left;"></div> 
         <div id="panel" style="width: 300px; float: right;"></div> 
       </div>
    
       <script type="text/javascript"> 
    
         var directionsService = new google.maps.DirectionsService();
         var directionsDisplay = new google.maps.DirectionsRenderer();
    
         var map = new google.maps.Map(document.getElementById('map'), {
           zoom:7,
           mapTypeId: google.maps.MapTypeId.ROADMAP
         });
    
         directionsDisplay.setMap(map);
         directionsDisplay.setPanel(document.getElementById('panel'));
    
         var request = {
           origin: 'Chicago', 
           destination: 'New York',
           travelMode: google.maps.DirectionsTravelMode.DRIVING
         };
    
         directionsService.route(request, function(response, status) {
           if (status == google.maps.DirectionsStatus.OK) {
             directionsDisplay.setDirections(response);
           }
         });
       </script> 
    </body> 
    </html>

     

    Google Map driving direction

 0 Comment(s)

Sign In
                           OR                           
                           OR                           
Register

Sign up using

                           OR                           
Forgot Password
Fill out the form below and instructions to reset your password will be emailed to you:
Reset Password
Fill out the form below and reset your password: