Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to show travel DIRECTION ARROW in Google Map Javascript API when using POLY LINE? [closed]

Using Google maps javascript API i want to draw arrow on top of the poly line so when the user is looking at the Map he would understand that some one traveled from here and to here.

The existing functionality

img

I want something like this

img

Please help.

Help will be appreciated.

like image 420
Chintan Patel Avatar asked Mar 04 '12 11:03

Chintan Patel


1 Answers

You may calculate the angle between two points, here's a how-to.

Depending on the calculated angle you can place a marker at the start-point. Here you find the description of the markers: http://sites.google.com/site/gmapicons/home/ (Direction indicators)


Edit:

See a demo: http://jsfiddle.net/doktormolle/9gJjj/

You'll find a function fx() there which expects a DirectionsRoute as argument and draws the markers.


Edit2:

Note that you may also use an IconSequence which may be a better approach, See: Google Map API Direction Triangle Icon Ambiguous

like image 141
Dr.Molle Avatar answered Oct 21 '22 13:10

Dr.Molle