Home/ Questions/Q 5959245
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-22T18:39:27+00:00

For the simplicity sake I have put the code for displaying the map and

  • 0

For the simplicity sake I have put the code for displaying the map and the route in the function “initialize“. The Map IS getting displayed, but the route is not. Please point out the error.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps JavaScript API Example</title>
    <script src="http://maps.google.com/maps/api/js?sensor=false" type="text/javascript"></script>

    <script type="text/javascript"> 

        var map;
        var latlng = new google.maps.LatLng (-34.397, 150.644);

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

        function initialize ()
        {
            var myOptions = 
            {
                zoom:8,
                center:latlng,
                mapTypeId:google.maps.MapTypeId.ROADMAP
            };

            map = new google.maps.Map (document.getElementById ("map"), myOptions);

            directionsDisplay.setMap (map);

            var initialPoint             = latlng;

            var latlng2 = new google.maps.LatLng (-34.400, 150.744);
            var pointAfterDragging       = latlng2;

            var start = initialPoint;
            var end   = pointAfterDragging;

            var request = {
                        origin:start,
                        destination:end,
                        travelMode:google.maps.TravelMode.DRIVING
                        };


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

        </script> 
    </head>
    <body onload="initialize()" onunload="GUnload()" topmargin="0" leftmargin="0">
    <div id="map" style="width: 341px; height: 271px"></div>
    <div id="directionsPanel" style="float:right;width:30%;height 100%"></div>
    </body>
    </html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You have two problems.

    First there is no method defined called GUnload.

    Second, the directions you are trying to get returns ZERO_RESULTS. You can always try to alert status to see whether it returns any directions. If it doesn’t nothing will be shown.

    You should try with some other locations instead and it should be fine. You can also pass it addresses instead of latlng’s if you want to try that instead 🙂

    To alert the status you could do this:

    directionsService.route (request, 
                            function (result, status) 
                            {
                                alert(status);
                                if (status == google.maps.DirectionsStatus.OK)
                                {

                                    directionsDisplay.setDirections (result);
                                }
                            });
        }
    • 0