CustomIconsRoute.html - google-maps-api-examples - Project Hosting on Google Code

Source path: svn/ trunk/ CustomIconsRoute.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <style type="text/css">
        html,body{height:100%;width:100%;padding:0;margin:0}
        #map{height:100%;width:70%;float:left}
        #directions{height:100%;width:30%;float:right}
    </style>
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;sensor=false&amp;key=ABQIAAAAB9142phf30Ujt0f-FFtgeBQqxEqhJnUAh6MTvF20C00JCJXsURSg8FMu3Pcd-uWwTVoXbvUwrsZ2ew" type="text/javascript"></script>
    <script type="text/javascript">
        var directions, map;
        function load() {
            map = new GMap2(document.getElementById("map"));
            var directionsPanel = document.getElementById("route");
            directions = new GDirections(null, directionsPanel);
            GEvent.addListener(directions, "load", onGDirectionsLoad);
             directions.load(
                "from: 500 Memorial Drive, Cambridge, MA to: 4 Yawkey Way, Boston, MA 02215 (Fenway Park)"
                , { getPolyline: true }
            );
         }
         function onGDirectionsLoad() {
             var poly = directions.getPolyline();
             var count = poly.getVertexCount();
             var bounds = poly.getBounds();
             map.setCenter(bounds.getCenter(), map.getBoundsZoomLevel(bounds));
             map.addOverlay(poly);
             // Customize here
             var customStartIcon = G_DEFAULT_ICON;
             var customEndIcon = G_DEFAULT_ICON;
             // End of the customization
             map.addOverlay(new GMarker(poly.getVertex(0), customStartIcon));
             map.addOverlay(new GMarker(poly.getVertex(count - 1), customEndIcon));
         }        
    </script>
</head>
<body onload="load()">
    <div id="map"></div>
    <div id="directions"><div id="route"></div></div>
</body>
</html>

Show details Hide details

Change log

r7 by jaderd on Sep 15, 2009 Diff

[No log message]

Go to:

Project members, sign in to write a code review

Older revisions

All revisions of this file

File info

Size: 2016 bytes, 43 lines

View raw file