Drawing routes on google maps - javascript

Is it possible to draw routes with google maps or any other map api? Like when you're looking for direction from point a to point b on google map with Get Directions button.
I'd like to draw a line that follows certain road but without the directions I don't need those. And if I can draw multiple lines between multiple points on the map that would be awesome.
Has anyone had experience with this before?

You can either use the Directions API or, if you really prefer to ignore the directions Google generates, you can use the maps API drawing functions to draw your own lines on the map.

You can also employ "drawing library"
https://developers.google.com/maps/documentation/javascript/drawing
But,this experimental tool cant specify colors nor line-thick via GUI.
My enhanced example is at:
http://members.jcom.home.ne.jp/tcltk-d/ge-navi.html
(select "Drawing" view to draw)

Related

Using Google Maps API with custom tiles

So, basic gist is, I have my own tiles of not the real world I'd like to display with the Google Maps viewer. I've found examples of how to split an existing single image into tiles for use with it, but nothing that deals with setting up your own tiler.
I have map data such as this:
https://dl.dropboxusercontent.com/u/44766482/superimage/index.html
Which right now is just a bunch of 1600x1600 images in an html table. This naive method works, but I'd like to switch to the more robust google api for better zooming and smarter streaming of the image data.
I've been unable to find a good example of how to generate your own tiles for the zoom levels and bring it together with some html/js.
If you want some more information for the goal process;
I have a python script that can output any size tiles of the map, at any zoom level. I'd like to bundle those together into a google maps api website. But in my own efforts I have not found a good example or documentation of how to do that. For one, I can only find examples of how the zoom levels work for the real world map, but not for a custom one.
Edit:
Got most things working as I want them, but I'm still confused regarding the "center" that can be set, as it's in lat and lng, which don't apply. I'd also like to set boundaries as currently it tries to load .png files outside of the maps range.
My current progress:
https://dl.dropboxusercontent.com/u/44766482/googlemapspreview/index.html
I think what you are looking for is the google maps imageMapTypes:
https://developers.google.com/maps/documentation/javascript/maptypes#ImageMapTypes
Basically, each zoom level is the 4 lower zoom tiles combined. A Projection function can be skipped to get orthogonal mapping.

Google Maps - Drag & drop markers and draw routes

I am trying to implement an interface like below with jQuery/JS and Laravel PHP framework. Could anyone help me to figure out the following questions I have?
How to make the markers draggable and on marker release get the
lat/lon?
How can I show the real path between point 1 & 2 (like the blue line. when I change the marker a new line will be drawn based on the shortest distance)?
If there are multiple markers connecting to each others like below, how can I get the optimise route?
For markers are connecting to each others.
This is the optimise route to visit all 4 markers (shortest path to visit)
Is there an open source project similar to this? (like jQuery calendar)
If you know any resources/plugins related to achieving something like this please comment below.
Draggable markers on Google Map - search for "Make a marker draggable":
https://developers.google.com/maps/documentation/javascript/markers
Planning route from point A to point B based on road map. You can use Directions API:
https://developers.google.com/maps/documentation/directions/intro

google maps API highlight areas

Is there a way to highlight areas with Google Map JS API v3?
I've seen some websites do it
here are some examples:
http://www.streetadvisor.com/new-allakaket-yukon-koyukuk-alaska
http://www.homely.com.au/werribee-wyndham-melbourne-greater-victoria
http://www.realestate.com.au/neighbourhoods/upwey-3158-vic
This is called a polygon.
See the Google Docs for information.
You can manually set polygon points in JS.

Javascript plugin to draw markers, lines, and shapes on a latitude/longitude grid for offline use?

I am attempting to make a simple PhoneGap app that will allow a user to input lat/long points and bearings and calculate their estimated intersection, along with a measure of error. I would like to display the lines, intersection, and an error elipsoid on a map or at least a grid of latitude and longitude lines, so the user can visualize the accuracy of the point. The tricky part is that this will be used for wildlife tracking in areas where the user may not have cell service. Is there some sort of Javascript plugin that will make a lat/long grid available for me to draw georeferenced lines and shapes on? I would love to use something like the Google Maps API, but that clearly won't work for offline use. I've Googled quite a bit, but I'm not sure where to start with this or if it's even feasible at all.
This program is similar to what I'm trying to achieve: http://www.locateiii.com/
Any ideas are greatly appreciated.
I'd use d3.js and http://code.google.com/p/gmapcatcher/ something like this where you can keep the google maps offline. If that's not feasible you can always us D3 with a svg of the map.
I ended up using OpenLayers with OpenStreetMap tiles prepared by Maperitive. Simple and works well with PhoneGap.

touch or click/drag to draw arbitrary area on Google Maps

I am familiar with how to draw circles and polygons on a Google Map using the javascript API. However, I've been looking at some android apps that allow you to "touch and draw" a freehand area on a map, not a collection of polyline/points or geometric shapes.
Is this functionality accessible to the js API? If so, how? I only find documentation on the polygons etc.
Note: this type of functionality is not what I'm looking for! Clicking at multiple points to define an area is fine, but I'm trying to do a real "drawing" style.
Thanks

Categories