Google maps route tracking - gps

Question

I'm using Google Maps to generate driving directions. I'd like to have a feature that would estimate where in the route someone is, based on the elapse time, and the total time from Google, and drop a pin (possibly a moving pin) where they're estimated to by.
I know how to generate the map in Google, but that's about where the limit of my knowledge is. How would I drop the pin in the approx location.
I'm thinking converting the total time into seconds, the elapse time into seconds and divide to get the percentage completed on the route. How would I drop a pin to the route location where this would be? Moreover, could I move the pin maybe updated every 30 - 60 seconds?

Answer 1

The duration attribute of Maps results is already in seconds. With that in mind, you can, in a sense, follow the route -> legs -> steps duration to give you a rough idea of how far along the trip each step is.
Now that you know the rough idea of how far into the trip each step is, you can do a comparison with the elapsed time to see which step they should be on. Once you've verified the correct step, you can use the step's lat_lngs to place a marker. lat_lngs is the array of points passed during that step, so you can work out which lat_lng to place the marker at based on the elapsed time compared to the time they should have been starting the step and the time when they should be finishing it.
Here's some code that won't run on your application, and doesn't include any real elapsed time logic, so it's best to treat it as pseudocode:
// route is a directionsService (google.maps.DirectionsService()) result
route = response.routes[0];
route.legs.forEach(function(leg) {
var counter = 0;
leg.steps.forEach(function(step) {
counter = counter + step.duration.value;
console.log("Route progress in seconds: " + counter);
if (elapsed >= counter) {
// percent would take the beginning and end time for the step
// and compare it to the elapsed duration to get a percentage
// that would be used to get the index of the appropriate lat_lng
var marker = new google.maps.Marker({
position: step.lat_lngs[percent],
map: map,
title: "Current Location"
});
}
});
});
You'd have to create your own logic for actually updating the map and such, but hopefully this is a decent starting point.