Prevent two google maps polylines overlapping

Question

I'm making a google maps app that displays GPX tracks. Some of the tracks do overlap for a distance. They do not have identical points, but the polylines seems identical when they are drawn. This makes one of them disapear behind the other one. The solution would be to draw overlapping tracks next to each other, like subway maps do. How can I do this in the simplest possible way?

Answer 1

Drawing side-by-side polylines automatically would be very difficult. The maths is tricky even if you were doing it for a fixed zoom level. The lines would have to be recalculated and redrawn for each zoom level because the lat/lng offsets required to offset the lines by the same pixel width doubles for each zoom level.

If you've only got a few tracks, try displaying them in contrasting colours with different widths, displaying the wider ones first. That way you can see the sides of a wider track when a later narrow track is drawn above it.