Change Google Maps direction line to icons - google-maps

Is there a way to change the default Google Maps direction line, the blue line that you are meant to follow, into a series of icons?
So instead of having a blue line showing the route on the map, I'd like to replace this with a series of small icons.
Or, if that isn't possible, can I place icons along the route in say 1km increments?
I see plenty of examples of replacing the start and end markers but not of the line.

Yes, it is possible. One option:
PolylineOptions to the DirectionsRenderer, you can also apply symbols to the Polyline
(example using a "dash" symbol)
or extract the route data and use it to put icons at all the vertices on the polyline (like the answer to this question, but with a transparent polyline)
example of a custom DirctionsRenderer
markers every 2km on a Polyline
markers at 2 arbitrary distances on a directions polyline

Related

Google map API marker with letter on map

Is there a way to access the colored markers with a letter from google?
I can only use the red ones with letters like
But I need green markers with a letter like I get it from the directions API from google. Like this one here
Is there a way to access to the colored markers with letter?
Or do I have to add the markers to my image folder?
You must use :
http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=D|00FF00|000000
chld parameter is the letter you want to appear in your marker.
After the pipe, the first RGB code is the color of the marker, the second is the background color of the marker. The last one is optional.
So you can create your marker like this :
var myPin= new google.maps.MarkerImage("http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=D|00FF00|000000");
and use it like you want !

Get latitude and Longitude of animated symbol on polyline

I have a map with a polyline and an animated symbol on the line. Just like the example that Google have here
https://developers.google.com/maps/documentation/javascript/examples/overlay-symbol-animate
Now I want to extract latitude and longitude of the animated symbol as it animates. I want to pan the map to the symbol so if the symbol is out of bound, the map automatically adjusts it self to show the animated symbol.
If there is any other work around to do this rather than getting the lat long points, do tell me.
I am not sure there is a latlng object available for the symbol.
By looking at the line object in the example you provided, it looks like only the offset attribute can be accessed.
However, you can compute the position of the symbol from this value:
Example: http://jsfiddle.net/ZPkMq/
If your polyline is not a straight line, finding the position of the symbol may be slightly more complex (but doable - see place marker on polyline with specific distance)
The thing is you can't get the LatLng point from the animated symbol. I just discarded using the symbol and started using marker to animate along a polyline. This gives a lot more options, and you can do almost anything.

How would I make a polygon based on the relative positions of markers in google maps?

I have a list of markers that I want to create a polygon around (showing the area around the markers and not the markers themselves). So instead of having the poly points be the direct lat/long of the markers, I want the poly to "wrap" around the markers to show the relative area around them.
Any ideas on how I could accomplish something like this?
This is called a convex hull. There's an example at http://www.geocodezip.com/v3_map-markers_ConvexHull.asp which uses the algorithm described at http://softsurfer.com/Archive/algorithm_0203/algorithm_0203.htm

Draw area/polygon and retrieve coordinates with google maps

Is there any tool that can help me with getting the coordinates for a specific area/polygon?
I usually use Google Earth.
Draw a polygon, then move the mouse over and right click > copy.
Then you can paste it in the notepad and you will find the coordinates there (remeber the format (long, lat,n) the reverse of Google Maps format.
You can also use online tools to format the information or remove parts.
http://www.earthpoint.us/Shapes.aspx
So the idea is to have a map, draw a polygon on it (I assume by placing the vertexes) and then getting the coordinates of the vertexes?
You can make markers draggable when you create then. You can also get the lat/lng position of the markers when certain events fire: the 'dragend' event, for instance.
With these tools, you have the basics of your requirements here. Make a button that places vertexes on the map - just use a marker with custom graphics - and let the user drag the vertex to whatever position they need. Record the new position of the vertex whenever the dragend event fires. Draw lines on the map between the markers, to show to the user the area selected. Have a button to 'complete' the shape, linking the last vertex up with the first vertex.
There may be some existing code to do this, but I am not aware of it. However, it should be possible to throw something together with a bit of work.

Can I draw a straight line in Google Maps?

Is there an API I can use to draw a straight line between two points in a Google map, and to show the line in different colors?
Example: draw a straight line between NYC and Los Angeles with green or red line?
Yes. Have you checked out the Google Maps APIs?
For example check out the source code for this example
Check this out, http://www.birdtheme.org/useful/v3tool.html. This application uses the Google Maps API Version 3 (V3). When you draw the line between two cities, this tool will auto generate kml or javascript code for you, and you can import it into your website and load the map
Using Polylines, you can draw a straight line.
You can see an example here
This worked for me. With the method mentioned here I was able to draw polylines on Google Maps V2. You can easily change color and width of these polylines. I drew a new line whenever the user location got changed, so the the polyline looks like the path followed by user on map.
Source code at. Github Repository: prasang7/eTaxi-Meter
Please ignore other modules of this project related to distance calculation and User Interface if you are not interested in them.