Google Maps directions V3: Multiple directions on a map

Question

I am trying to render multiple directions(well, their Polylines, essentially) on a single instance of a map. In the prior version of the maps API, I did something like

//directions[] stores the GDirections objects
//x[] is an array of Elements extracted from an XMLHTTPResponse object
//iterating over the values in x[]
GEvent.addListener(directions[i], "load", function() {
 var polyline = this.getPolyline();
 map.addOverlay(polyline);
 polyline.setStrokeStyle({opacity:0.2})
 });

directions[i].load("from:here to:"+x[i].childNodes[0].nodeValue,{getPolyline:true});

Now that there are DirectionsService and DirectionsRenderer classes, I don't know what are the best practices for doing the same thing. Do I create multiple instances of DirectionsRenderer class and have them do a setMap() to the instance of the main map? Do I create multiple instances of the DirectionsServices class.

I am very new to javascript and functional languages in general and barely got past trying to understand functional closures as they pertain to callbacks. Apologies for the formatting as well.

Any help will be appreciated, I will try and clarify any points you may raise.

Answer 1

Hey Ephraim, after researching for hours and trying different solutions I came up with this, you need to create different instance of DirectionsRenderer and (this is important!) create the DirectionsService instance INSIDE the response function. This link will guide you to the right direction.