This topic has not yet been rated - Rate this topic

DirectionsStepEventArgs Object

Bing Services

Contains arguments for directions step events.

Properties

Name	Type	Description
handled	boolean	A boolean indicating whether the event is handled. Set this property to true to override the default behavior.
location	Location	The location along the route where the direction step occurs.
routeIndex	number	A number indicating the route (if multiple routes were returned) to which the directions step belongs.
routeLegIndex	number	A number indicating the route leg to which the directions step belongs.
step	DirectionsStep	The directions step.
stepIndex	number	A number indicating the index of the directions step within the route leg array.
stepNumber	number	A number indicating the directions step number within the route.

Example

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
   <head>
      <title></title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

      <script type="text/javascript" src="http://ecn.dev.virtualearth.net/mapcontrol/mapcontrol.ashx?v=7.0"></script>

      <script type="text/javascript">
         
         var map = null;
         var directionsManager = null;

         function GetMap()
         {
            // Initialize the map
            map = new Microsoft.Maps.Map(document.getElementById("mapDiv"),{credentials:"Bing Maps Key"});
            Microsoft.Maps.loadModule('Microsoft.Maps.Directions', { callback: directionsModuleLoaded });

         }



         function directionsModuleLoaded()
         {
            // Initialize the DirectionsManager
            directionsManager = new Microsoft.Maps.Directions.DirectionsManager(map);

            // Create start and end waypoints and add them to the route
            var startWaypoint = new Microsoft.Maps.Directions.Waypoint({address:"Seattle, WA"});
            var endWaypoint = new Microsoft.Maps.Directions.Waypoint({address:"Bellevue, WA"});

            directionsManager.addWaypoint(startWaypoint);
            directionsManager.addWaypoint(endWaypoint);

            // Set directions options
            directionsManager.setRequestOptions({ routeMode: Microsoft.Maps.Directions.RouteMode.transit});
            directionsManager.setRenderOptions({ itineraryContainer: document.getElementById('itineraryDiv') });

            // Specify a handler for when the directions are calculated
            Microsoft.Maps.Events.addHandler(directionsManager, 'directionsUpdated', displayMessage );
            Microsoft.Maps.Events.addHandler(directionsManager, 'itineraryStepClicked', displayStepMessage );
            Microsoft.Maps.Events.addHandler(directionsManager, 'directionsError', displayError);

            // Calculate directions, which displays a route on the map
            directionsManager.calculateDirections();

         } 

         function displayError(e)
         {
            alert(e.message);
         }

         function displayMessage(e)
         {
            alert("Click a step in the itinerary to display extra step information.");             
         }

         function displayStepMessage(e)
         {
            alert("The directions step that was clicked is step number " + (e.stepIndex + 1) + ", and the location of this step is: " + e.location);
         }

      </script>
   </head>
   <body onload="GetMap();">
      <div id='mapDiv' style="position:relative; width:400px; height:400px;"></div>       
      <div id='itineraryDiv' style="position:relative; width:400px;"></div>
   </body>
</html>

Did you find this helpful? Yes No

Not accurate

Not enough depth

Need more code examples

(1500 characters remaining)