I've got an app that tracks vehicles and draws a polyline of their travel path on a map. I want to convert this polyline into a route using the directions service routing. This will allow me to be able to drag the path around and manipulate it etc.
The problem is I can't think of a nice solution to this, and I'm not sure if it's possible. If I pass in the array of coordinates of the polyline to the directions service route it only draws a route using the start and the end of the polyline, it doesn't take into consideration any of the coordinates in between.
I tried to generate a 'waypoints' array using the polyline coordinates array by evenly dividing it and getting 8 coordinates in between and passing those in as the waypoints but it fails to render at all now. If I test the code using a coordinates array that was generated by drawing a route it works though, so I know the code is working. I'm presuming it fails because some of these coordinates may be slightly off the road (it's a polyline drawn from GPS positioning, so it's not 100% accurate), and Google doesn't just snap it to the nearest accepted location.
Can anyone think of a solution to this?
Here's code examples to make it a bit clearer:
// In the polyline app
var encoded_path = google.maps.geometry.encoding.encodePath(coordinate_array)
// In the route app
var coordinates = google.maps.geometry.encoding.decodePath(encoded_path);
var waypoints = [];
// Evenly get coordinates across the entire array to be used as waypoints
for (var i = 1; i <= 8; ++i) {
var index = Math.floor((coordinates.length/10) * i);
if (index >= coordinates.length - 1)
break;
waypoints.push({
'location': new google.maps.LatLng(coordinates[index].lat(), coordinates[index].lng()),
'stopover': false
});
}
var request = {
origin: coordinates[0],
destination: coordinates[coordinates.length - 1],
travelMode: google.maps.DirectionsTravelMode.DRIVING,
waypoints: waypoints
};
MapService.directionsService.route(request, function(response, status) {
if (status == google.maps.DirectionsStatus.OK) {
MapService.directionsDisplay.setDirections(response);
}
});