Displaying the directions result

1,411 views
Skip to first unread message

Daniel Gerzo

unread,
Nov 7, 2011, 6:47:01 AM11/7/11
to Google Maps JavaScript API v3
Hello all,

I am having a problem displaying the alternative route from the result
of the directions service.
My problem is that the directions are being rendered on the map, but
it is always the first route (i.e. index 0) even though I am setting
it to different values through setShortestRoute() (see below).
I am following the documentation here
http://code.google.com/intl/sk-SK/apis/maps/documentation/javascript/services.html#DisplayingResults
which says I need three things:

1. Create a DirectionsRenderer object.
2. Call setMap() on the renderer to bind it to the passed map.
3. Call setDirections() on the renderer, passing it the
DirectionsResult as noted above. Because the renderer is an MVCObject,
it will automatically detect any changes to its properties and update
the map when its associated directions have changed.

I am not modifying the directionsDisplay.routeIndex anywhere else
besides my setShortestRoute().
Whenever I check with firebug, the value is 0, even though I have set
it to a different value in setShortestRoute().

Here is part of my code:

var directionsRendererOptions = {
suppressInfoWindows: true,
suppressMarkers: true,
draggable: true,
}
var directionsService = new google.maps.DirectionsService();
var directionsDisplay = new
google.maps.DirectionsRenderer(directionsRendererOptions);

function initialize() {
map = new google.maps.Map(document.getElementById('right-
container'), mapOptions);
directionsDisplay.setMap(map);
}

[snip]

function setShortestRoute(response) {
// determine the shortest route
var idx = 0;
var min_distance = response.routes[0].legs[0].distance.value;
for (i=1, n=response.routes.length; i<n; i++) {
if (response.routes[i].legs[0].distance.value <
min_distance) {
min_distance = response.routes[i].legs[0].distance.value;
idx = i;
}
}
// display the correct route on the map
console.log('set idx: ', idx);
directionsDisplay.setRouteIndex(idx);
}

function calcRoute() {
var request = {
origin: marker_from.position,
destination: marker_to.position,
travelMode: google.maps.TravelMode.DRIVING,
provideRouteAlternatives: true,
};
directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
setShortestRoute(response);
directionsDisplay.setDirections(response);
}
});
}

Any help is appreciated!

MymsMan

unread,
Nov 7, 2011, 6:16:05 PM11/7/11
to google-map...@googlegroups.com
Try reversing the order of the lines:
                        setShortestRoute(response);
                        directionsDisplay.setDirections(response);

The handling of RouteIndex seems to be very strange, If you try to extract the RouteIndex in a directions changed events listener it returns undefined.

Bob

JKurtock

unread,
Nov 7, 2011, 6:18:04 PM11/7/11
to Google Maps JavaScript API v3
Aren't you calling setRouteIndex BEFORE you load the response into the
directionsDisplay? Just from your snippet, that's where I would look
first.

Of course, it could be more sure if you had posted a link to your non-
working map ....

- Jeff

On Nov 7, 4:47 am, Daniel Gerzo <dan...@rulez.sk> wrote:
> Hello all,
>
> I am having a problem displaying the alternative route from the result
> of the directions service.
> My problem is that the directions are being rendered on the map, but
> it is always the first route (i.e. index 0) even though I am setting
> it to different values through setShortestRoute() (see below).
> I am following the documentation herehttp://code.google.com/intl/sk-SK/apis/maps/documentation/javascript/...

Daniel Gerzo

unread,
Nov 8, 2011, 3:28:48 AM11/8/11
to google-map...@googlegroups.com
On Mon, 7 Nov 2011 15:18:04 -0800 (PST), JKurtock wrote:
> Aren't you calling setRouteIndex BEFORE you load the response into
> the
> directionsDisplay? Just from your snippet, that's where I would look
> first.
>
> Of course, it could be more sure if you had posted a link to your
> non-
> working map ....

Hello Jeff,

I have put up the example code here:
http://danger.rulez.sk/test_map.html

Currently, I am loading the reponse to directionsDisplay and then
catching the directions_changed event where I am trying to set the
index. However when it returns from there the index is 0 again. Is this
not supposed to work?

--
S pozdravom / Best regards
Daniel

MymsMan

unread,
Nov 8, 2011, 8:34:09 AM11/8/11
to google-map...@googlegroups.com
Sorry if I confused you by talking about the directions changed event.
I was trying to say the event is useless because the routeindex is not set until  setDirections(response) has completed.

You just need to call setShortestRoute After setDirections


   directionsService.route(request, function(response, status) {
      if (status == google.maps.DirectionsStatus.OK) {
         directionsDisplay.setDirections(response);
         idx = directionsDisplay.getRouteIndex();
         console.log('idx 2: ', idx);
         setShortestRoute(directionsDisplay.getDirections());
         idx = directionsDisplay.getRouteIndex();
         console.log('idx 3: ', idx);
      }

set idx: 1


Daniel Geržo

unread,
Nov 8, 2011, 3:50:48 PM11/8/11
to google-map...@googlegroups.com
On 8.11.2011 14:34, MymsMan wrote:
> Sorry if I confused you by talking about the directions changed event.
> I was trying to say the event is useless because the routeindex is not
> set until setDirections(response) has completed.
>
> You just need to call setShortestRoute After setDirections

OK, that works.
Thanks for help!

--
S pozdravom / Best regards

Daniel Gerzo

Reply all
Reply to author
Forward
0 new messages