3

I'm trying to draw an encoded polyline via the Google Maps API (v3), and it seems to draw 'sort of' correctly (as in, roughly in the right area of the world ;) ) but otherwise is very, very wrong. (Pictures to follow)

Essentially, I'm using the Strava API (v3) to get road 'segments', which include encoded polylines (http://strava.github.io/api/#polylines). The short version is, I'm decoding these as per the Google documentation and then creating a new Polyline object with the new path and adding it to the map.

I've been very brief in summing up that part, simply because my method doesn't seem to be the issue here... If I take the encoded polyline string directly from the response of the API call and paste it into Google's Interactive Polyline Encoder Utility (https://developers.google.com/maps/documentation/utilities/polylineutility) I see the same 'wrong' path.

So, that leaves two possibilities... Either the Strava API is passing out incorrect data, or I'm not correctly understanding what I'm supposed to do with it.

I've attached the relevant images + polyline below. Am I doing something obviously wrong?

Example 'encoded' polyline:

{ae{HntiQtCcDzG_I|^uc@rFgHhC{CxAiA~AaA~BkAvB}A|F_G|AgBbBkCtAwCd@sA|BoIVw@Pc@|@gBt@}@|@y@lCwBvA_B`@k@~@aBt@iBlAaE~@oEp@sDX{BP_BJaDAcEIeCe@gHo@yMUaEk@uDm@iD]mCAwBNsDXyDL}@nByIZyCt@cLr@gNB_ABoEAkFJmDTkBVeAZ_Af@gAnDwF|@gBbAoChHgUPWlAT`@B|@GbE_@dAW`Cu@vBe@tDs@xD{@`Bg@bBq@hBaAtB}@dCi@bF}@jBg@pBeAj@SNE\\C^@\\DbAZ`Ah@~C`A\\H|ALzAFLA^Gl@UdBgAjBaBZSh@Qz@MjD_@`FoAtCa@j@Ez@DxE|@xF\\nBP~@TxHvBf@Tb@\\pBvC\\^`@XxAf@fBT|BDfAIr@MfBe@rBa@rBMvBYxBg@xA_@^Ir@@NF|@l@nBfAjAj@dBV`Bb@lBbAbB~ALPhC`FV`@n@z@^VNBX?LGZa@d@eAp@qAt@Sx@Cz@G\\IZOhCcBb@c@T]jA_CrE_HfEiFz@}@p@k@|@o@`C{A`A{@rBwBx@oAbByCp@wArAoDLWxA}BhAcBjAqAlAiB~AaDr@sBp@{CD[TkC^}FZyD^oCx@gF`@qAh@kAz@yAtAgBpD_E|JoKdDuEjBcCfC{ExCqGdAgBlBuBrAyBpEkIpEsI\\]^YbAg@|GaBzKeEfBe@lCW`AQr@U|A_AtAkAhDyCpAeA|Aq@`EeCrDgBvA{@tD}C`BmAzBm@t@QvAQxBOl@Q~Ai@~BsAlCcB

Strava map (correct):

Strava (Correct)

Decoded polyline (wrong):

Decoded polyline (WRONG)

12

Ah.. rookie mistake...

The response included escaped backslashes facepalm. After removing those, it's all good.

  • 1
    Got caught by the same, I was pasting a string with backslashes too, interesting though that the linestring gets drawn around where it should be. – nevi_me Jan 21 '17 at 18:28
3

If anyone comes across this while working with ruby/rails this is what I had to do to get the correctly formatted string for javascript:

@polyline = YOUR POLYLINE STRING FROM RUBY STRAVA WRAPPER

then in view inside the javascript tag where I setup the map (or perhaps in a js asset file depending how you choose to structure your app):

var decodedPath = google.maps.geometry.encoding.decodePath('<%= @polyline.gsub("\\", "\\\\\\\\") %>');

Wasted much time on this. It looks wrong to me (thought it would be half the number of backslashes) but it was the only thing that worked for me. Hope it helps.

1

Just replace "\\" by "\"

For instance:
VHRHZN\\Pt@\\~@f@bB~@

becomes

VHRHZN\Pt@\~@f@bB~@

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.