//<![CDATA[
            var i = 0;
            // arrays to hold variants of the info window HTML
            var gmarkers = [];
            var htmls = [];
            var to_htmls = [];
            var from_htmls = [];


            function load() {
                if (document.getElementById("map_canvas") != null)
                    if (GBrowserIsCompatible()) {
                    // Create the map canvas
                    var map = new GMap2(document.getElementById("map_canvas"));
                    map.addControl(new GLargeMapControl());
                    map.addControl(new GMapTypeControl());
                    map.enableScrollWheelZoom();
                    //map.setCenter(new GLatLng(39.42781, -76.36903), 13);
                    map.setCenter(new GLatLng(39.14320, -76.81278), 13);

                    // Read the XML location data
                    var request = GXmlHttp.create();
                    request.open("GET", "Directions.xml", true);
                    request.onreadystatechange = function() {
                        if (request.readyState == 4) {
                            var xmlDoc = request.responseXML;
                            // obtain the array of markers and loop through it
                            var markers = xmlDoc.documentElement.getElementsByTagName("marker");

                            for (i = 0; i < markers.length; i++) {
                                // obtain the attributes of each marker
                                var lat = parseFloat(markers[i].getAttribute("lat"));
                                var lng = parseFloat(markers[i].getAttribute("lng"));
                                var point = new GLatLng(lat, lng);
                                var html = markers[i].getAttribute("html");
                                var label = markers[i].getAttribute("label");
                                var location = markers[i].getAttribute("location");

                                // create the marker for this loop iteration
                                var marker = createMarker(point, label, html, location);
                                map.addOverlay(marker);
                            }
                        }
                    }

                    request.send(null);

                } else {
                    alert("Sorry, the Google Maps API is not compatible with this browser!");
                }
            }


            // A function to create the marker and set up the event window
            function createMarker(point, name, html, location) {
                var marker = new GMarker(point);

                // The info window version with the "to here" form open
                to_htmls[i] = html + '<br>Directions: <b>To here</b> - <a href="javascript:fromhere(' + i + ')">From here</a><br>' +
                   '<br>Starting address:<br><input type="text" SIZE=40 MAXLENGTH=40 name="saddr" id="saddr" value="" /><br><br>' +
                   '<INPUT value="Get Directions" type="button" onclick="javascript:showDirections();" />' +
                   '<input type="hidden" id="daddr" value="' + name + "@" + point.lat() + ',' + point.lng() + '"/><br><br>';

                // The info window version with the "to here" form open
                from_htmls[i] = html + '<br>Directions: <a href="javascript:tohere(' + i + ')">To here</a> - <b>From here</b><br>' +
                   '<br>Ending address:<br><input type="text" SIZE=40 MAXLENGTH=40 name="daddr" id="daddr" value="" /><br><br>' +
                   '<INPUT value="Get Directions" type="button" onclick="javascript:showDirections();" />' +
                   '<input type="hidden" id="saddr" value="' + name + "@" + point.lat() + ',' + point.lng() + '"/><br><br>';

                // The inactive version of the direction info
                html = html + '<br>Directions: <a href="javascript:tohere(' + i + ')">To here</a> - <a href="javascript:fromhere(' + i + ')">From here</a>';

                GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml(html); });

                // save the info we need to use later for the side_bar
                gmarkers[i] = marker;
                htmls[i] = html;

                i++;

                return marker;
            }

            // functions that open the shadowed direction bubbles
            function tohere(i) { gmarkers[i].openInfoWindowHtml(to_htmls[i]); }
            function fromhere(i) { gmarkers[i].openInfoWindowHtml(from_htmls[i]); }

            // show the directions
            function showDirections() {
                var saddr = document.getElementById("saddr").value;
                var daddr = document.getElementById("daddr").value;

                // Make the starting address safe
                var encodedSADDR = escape(saddr);
                encodedSADDR = encodedSADDR.replace("+", "%2B");
                encodedSADDR = encodedSADDR.replace("/", "%2F");
                encodedSADDR = encodedSADDR.replace("%2C", ",");

                // Make the destination address safe
                var encodedDADDR = escape(daddr);
                encodedDADDR = encodedDADDR.replace("+", "%2B");
                encodedDADDR = encodedDADDR.replace("/", "%2F");
                encodedDADDR = encodedDADDR.replace("%2C", ",");

                // Form the URL                
                encodedURL = 'http://maps.google.com/maps?saddr=' + encodedSADDR + '&daddr=' + encodedDADDR; // + '&output=html';

                // Show in IFrame
                //frames['mapframe'].location.href = Url;

                // Show in new popup window
                window.open(encodedURL);

               
            }