12

I have routes as Google Maps Polylines in my project (an example, http://rutasgdl.com/rutas/626-2 ) and I want to add direction arrows to the routes. I want something like this (sadly, it is for Google Maps V2) http://wtp2.appspot.com/ArrowLine.htm

Can you point me in the right direction in order to achieve this? Regards.

John Conde
  • 217,595
  • 99
  • 455
  • 496
Jaec
  • 390
  • 2
  • 8
  • 18

4 Answers4

7

The Google Maps API now supports this natively (as of July 2012).

https://developers.google.com/maps/documentation/javascript/symbols#add_to_polyline

awmross
  • 3,789
  • 3
  • 38
  • 51
4

I found a blog entry by Pavel Zotov, where he describes a way to add arrows to a polyline. The trick is to extend google.maps.OverlayView.

http://yab.hot-line.su/javascript/polyline-with-arrows-in-google-maps-api-v3.html

(I don't know if I can reproduce the code here, so I only post a link to the blog entry.)

Vincent
  • 170
  • 1
  • 8
  • 9
    The above blog is now unavailable (forbidden 403 error). An alternative source is: www.wolfpil.de/v3/arrow-heads.html (again, license is unclear so I'm not sure if I can past the code in). – Kevin Aug 30 '11 at 21:38
1

Here is the code from Bill Chadwick ported to v3

Enjoy!

https://docs.google.com/open?id=0B4WFC4iBvLilOHc1YTFnakFsdWM

  • 1
    Small bug in your code: strokeColor:this.color, strokeOpacity:this.opacity, strokeWeight:this.weight, Must be: strokeColor:this.headColor, strokeOpacity:this.headOpacity, strokeWeight:this.headWeight, – Jorrit Schippers Aug 28 '12 at 10:12
0

The simple solution is use add a short line segment angled back 45 degrees to the end of the line. This thread is 10 years old but I still dont find a built in arrow to use in Google Earth. Bob Fontaine