Pingi
Pingi

Reputation: 342

Show a route on a map

How can i show the following result: http://maps.googleapis.com/maps/api/directions/json?origin=hadera&destination=haifa&sensor=false

on a map? i want to see the entire route!

please: no use of google's javascript API. just the Web Service

Upvotes: 7

Views: 6754

Answers (2)

miguev
miguev

Reputation: 4865

I assume you want to show the route on a Google Map, which is mandatory ;)

You can do this without using the JavaScript API, just use the Static Maps API with the path parameter containing the encoded polyline you'll find in the overview_polyline field of the route of your choice.

Example using the first route (that is, response.routes[0].overview_polyline.points) from your sample request:

"overview_polyline" : {
    "points" : "en_eEsoctEa@IuAvHzD~@hGrA~D~@i@vCgAlGa@|BqFp[kBOyBAgADk@Hw@JqBb@cIjAcC`@{Cr@iKrC_Bh@kDhAeCx@}Bn@}IpCcFtAq@Hs@D_A?yAEoAQi@OcA]kAg@}OoKmMqIkCgBoBgA}D{Bm@]ERiAxGoA`IYtAs@hCwAzDsB`EoDhGkDrGkBbDmBbD_CrC{@`AcAn@c@Pm@JUDa@?u@Cq@Mo@Um@c@cC}BmGgGgc@yd@qSmTsNiOwDoDqCmBkCuAcA]oC_AyCw@}Bc@_BO{BOwE@aDNiBRyARyBd@_K|Cag@bPsVdImDhAkBf@qCf@_AJqADeABcBCuAIqC_@kIqAuLaBgNmBuImAqFs@kL_BsEq@qEk@eGo@aFUqEIoOSiLI_DAgQQuDIiEa@u\\iDwBOiGw@yB_@uCy@yPsEaIwBiL_D{Cu@sAUgDk@uCYgAIeBCoEAax@nAgC@qCGcBIeCWmKmAmOaBkH_AqCc@}Aa@{CaAaBs@}BiAwMyGoAk@kBcAqHqDcBs@kC}@_D_AwCu@_BUgC[eDSeFIs@A{BFs`AtA_HH}CAoCIwBMsH]sMm@iMm@wG]qDYiFm@eFw@iCg@{Cs@cFsAwI}BqJgC{C{@cKmCuLaDuXmHwT_GuCu@sBc@wGkAqB[kDa@gE]eDQeGO{CCmC@}CFmCHcG\\yLx@wN`AcEXkETyDHiH@_DGgEO_F]sFi@oNuAgP_BwWgCsO{AuCa@eCe@eBa@wBm@uCaA}EwBwBiAaCyAsAaAyDcDoN_NmWqVgA_AiDeCwD_CyAy@wD_BeEyAsBk@kDs@uB]_CYyCU{AIyFOyCGyTW{SYiEEsJQ}ECyA@mDLyFVoCVyBZyCd@aDv@kDdAkA^gAh@qDrAsLtFmInDoBt@oAd@eATcG`AmCLo@Ds@?oCEeAG{lB_VaM{AyGs@aHYuISeB?gHMiLYyJe@gO{AwCUwGs@yf@_FaFc@u@KqI{@{Iy@wEa@{De@gO{AqC]mHk@gEOoPUoOQ_S[kKOmBIkBWs@Q}@[}@e@eAy@{AkBoAgBqDmHi@eAs@_Ae@e@sAaAcAm@_Ac@}@U_AM_BK}BM]@eCEyBJaALs@LsA\\_Bv@{BlAiBhAyAx@{Ap@wCtAaFjC_CfAwBv@cB\\kDt@_LnBwJbBmEb@gJp@M@{BLcD`@cDX}E`@_CLuBCcEWmKk@{Dg@cCYaEgAqCoAoBwAcCgC}EmGg@m@gDkEuE{FiBwBoBsCkAwB}@wBo@gCa@sCMqAMoD@uIBkDFuQ@qDBy@"
},

Resulting map:

Driving directions from Hadera to Haifa

Full request, requires URL-encoding the encoded polyline:

http://maps.googleapis.com/maps/api/staticmap?sensor=false&size=400x400&path=weight:3%7Ccolor:red%7Cenc:en_eEsoctEa%40IuAvHzD~%40hGrA~D~%40i%40vCgAlGa%40%7CBqFp%5BkBOyBAgADk%40Hw%40JqBb%40cIjAcC%60%40%7BCr%40iKrC_Bh%40kDhAeCx%40%7DBn%40%7DIpCcFtAq%40Hs%40D_A%3FyAEoAQi%40OcA%5DkAg%40%7DOoKmMqIkCgBoBgA%7DD%7BBm%40%5DERiAxGoA%60IYtAs%40hCwAzDsB%60EoDhGkDrGkBbDmBbD_CrC%7B%40%60AcAn%40c%40Pm%40JUDa%40%3Fu%40Cq%40Mo%40Um%40c%40cC%7DBmGgGgc%40yd%40qSmTsNiOwDoDqCmBkCuAcA%5DoC_AyCw%40%7DBc%40_BO%7BBOwE%40aDNiBRyARyBd%40_K%7CCag%40bPsVdImDhAkBf%40qCf%40_AJqADeABcBCuAIqC_%40kIqAuLaBgNmBuImAqFs%40kL_BsEq%40qEk%40eGo%40aFUqEIoOSiLI_DAgQQuDIiEa%40u%5CiDwBOiGw%40yB_%40uCy%40yPsEaIwBiL_D%7BCu%40sAUgDk%40uCYgAIeBCoEAax%40nAgC%40qCGcBIeCWmKmAmOaBkH_AqCc%40%7DAa%40%7BCaAaBs%40%7DBiAwMyGoAk%40kBcAqHqDcBs%40kC%7D%40_D_AwCu%40_BUgC%5BeDSeFIs%40A%7BBFs%60AtA_HH%7DCAoCIwBMsH%5DsMm%40iMm%40wG%5DqDYiFm%40eFw%40iCg%40%7BCs%40cFsAwI%7DBqJgC%7BC%7B%40cKmCuLaDuXmHwT_GuCu%40sBc%40wGkAqB%5BkDa%40gE%5DeDQeGO%7BCCmC%40%7DCFmCHcG%5CyLx%40wN%60AcEXkETyDHiH%40_DGgEO_F%5DsFi%40oNuAgP_BwWgCsO%7BAuCa%40eCe%40eBa%40wBm%40uCaA%7DEwBwBiAaCyAsAaAyDcDoN_NmWqVgA_AiDeCwD_CyAy%40wD_BeEyAsBk%40kDs%40uB%5D_CYyCU%7BAIyFOyCGyTW%7BSYiEEsJQ%7DECyA%40mDLyFVoCVyBZyCd%40aDv%40kDdAkA%5EgAh%40qDrAsLtFmInDoBt%40oAd%40eATcG%60AmCLo%40Ds%40%3FoCEeAG%7BlB_VaM%7BAyGs%40aHYuISeB%3FgHMiLYyJe%40gO%7BAwCUwGs%40yf%40_FaFc%40u%40KqI%7B%40%7BIy%40wEa%40%7BDe%40gO%7BAqC%5DmHk%40gEOoPUoOQ_S%5BkKOmBIkBWs%40Q%7D%40%5B%7D%40e%40eAy%40%7BAkBoAgBqDmHi%40eAs%40_Ae%40e%40sAaAcAm%40_Ac%40%7D%40U_AM_BK%7DBM%5D%40eCEyBJaALs%40LsA%5C_Bv%40%7BBlAiBhAyAx%40%7BAp%40wCtAaFjC_CfAwBv%40cB%5CkDt%40_LnBwJbBmEb%40gJp%40M%40%7BBLcD%60%40cDX%7DE%60%40_CLuBCcEWmKk%40%7BDg%40cCYaEgAqCoAoBwAcCgC%7DEmGg%40m%40gDkEuE%7BFiBwBoBsCkAwB%7D%40wBo%40gCa%40sCMqAMoD%40uIBkDFuQ%40qDBy%40

Upvotes: 14

Yoni H
Yoni H

Reputation: 463

how about google's support for embedding? or how to add google maps to your website

the easiest way to use it is go to actual google maps and use the link button, then use the link in your site/whatever

Upvotes: 0

Related Questions