My issue is when users enter their address (with autocomplete), the expected behaviour is that the map would display a marker on the address. But for some strange reason, the map does not display :(
Here is where my test environment is, please have a look:
http://mycanprev.com/onboard-test/
Click on the "Location" tab to get to the geocomplete portion. When you enter your address, it's suppose to display the map with the marker set on the entered address but it just displays a gray box instead of the map.
The map seems to display fine on mobile though.
I think the issue might be with the z-index, but I'm not sure how to fix it :(
Thanks for your help.
There's a lot of issue that caused the gray box in the maps. You can try this following solution:
First, make sure that you used the correct Google Maps API, valid API Key and not deprecated function calls.
Setting the zoom parameter correctly. Check this SO question 11749742 and 5838333.
Check the size of your maps DIV element and css. Check this SO question for that.
I want to embed "my maps" to my website using iframe, but I want to let my clients to open that map in a new window and see their location on it.
If I open my map in edit mode on my phone: www.google.com/maps/d/edit?mid=*** I see my position, if I change the mode to "view" it stops tracking my location.
Is there a way to open the big map and to see the current position? It's very useful... Maybe there is another way to embed it...
Based on the documentation
url: https://developers.google.com/maps/documentation/staticmaps/intro?hl=en
it seems that it is not possible to get the current location (position of the client) using the parameters which go along with the url. This means that you can not use iframe and embed google maps inside it to get your current position.
However, you can still use geolocation and program it to get the user current position on the map,
url (code included in the link): https://developers.google.com/maps/documentation/javascript/examples/map-geolocation
Bare in mind that the google map API will always ask you the permission to access data in order to locate you.
http://snag.gy/mHDah.jpg
Please look at the above picture.
I want to add a place to the map and export embed html widget to my web site.
But the problem is a place is not there. (Not body added that place to Google Map).
I want to mark that place with a red point in a embed map. (Please look at the below snapshot)
http://snag.gy/7DFm3.jpg
Please help me.
Maps Engine Lite (Beta) is a tool which allows you to design and save your own custom maps. In order to make use of it, you'll need to have a Google account and be logged in.
For example, have you tried to embed a newer Google map into a web
page? The reliable old "link" button is nowhere to be found!
A simple example is here
Those pins are called markers in the gmaps API.
This example does what you want: https://developers.google.com/maps/documentation/javascript/examples/marker-simple
You can use normal Google maps to find out the coordinates for your place by right-clicking on it and choosing "what's here" (works in chrome and safari at least).
I have a client who has embedded Google Maps showing the location of a new hospital they are building. Until recently it just showed the pin marker, however now it is showing the longitude and latitude next to the pin. I have tried everything to remove this text but none of the options in the query string appear to do anything.
I think Google has updated the embed code but I can't find any documentation about it though. Does anyone have any suggestions?
Thanks
John
From the research I did, it seems like the new Google maps is pretty rigid and there isn't really a simple way. I think it would require some more complex API stuff.
This is the post that I found that described the limitations Removing the info window from an embedded map in the new Google Maps
Sorry I realize that doesn't really help.
I want to link to google maps at a particular location with a marker on a particular point.
It's easy to link to a location:
http://maps.google.com/?ll=XX.XXXX,XX.XXXX
But how do I drop a marker at that point too? preferably with a bit of my own text but that's just a bonus.
2017 - Google has released documentation on this see new accepted answer: https://stackoverflow.com/a/44477650/359135
In May 2017 Google launched the official Google Maps URLs documentation. The Google Maps URLs introduces universal cross-platform syntax that you can use in your applications.
Have a look at the following document:
https://developers.google.com/maps/documentation/urls/guide
You can use URLs in search, directions, map and street view modes.
For example, to show the marker at specified position you can use the following URL:
https://www.google.com/maps/search/?api=1&query=36.26577,-92.54324
For further details please read aforementioned documentation.
You can also file feature requests for this API in Google issue tracker.
This format works, but it doesn't seem to be an official way of doing so
http://maps.google.com/maps?q=loc:36.26577,-92.54324
Also you may want to take a look at this. They have a few answers and seem to indicate that this is the new method:
http://maps.google.com/maps?&z=10&q=36.26577+-92.54324&ll=36.26577+-92.54324
If you want to include a zoom level, you can use this format:
https://www.google.com/maps/place/40.7028722+-73.9868281/#40.7028722,-73.9868281,15z
will redirect to this link (per 2017.09.21)
https://www.google.com/maps/place/40%C2%B042'10.3%22N+73%C2%B059'12.6%22W/#40.7028722,-73.9868281,15z/data=!4m5!3m4!1s0x0:0x0!8m2!3d40.7028722!4d-73.9868281
This URL format worked like a charm:
http://maps.google.com/maps?&z={INSERT_MAP_ZOOM}&mrt={INSERT_TYPE_OF_SEARCH}&t={INSERT_MAP_TYPE}&q={INSERT_MAP_LAT_COORDINATES}+{INSERT_MAP_LONG_COORDINATES}
Example for Mount Everest:
http://maps.google.com/maps?&z=15&mrt=yp&t=k&q=27.9879012+86.9253141
Full reference here:
https://moz.com/ugc/everything-you-never-wanted-to-know-about-google-maps-parameters
-- EDIT --
Apparently the zoom parameter stopped working, here's the updated format.
Format
https://www.google.com/maps/#?api=1&map_action=map&basemap=satellite¢er={LAT},{LONG}&zoom={ZOOM}
Example
https://www.google.com/maps/#?api=1&map_action=map&basemap=satellite¢er=27.9879012,86.9253141&zoom=14
If working with Basic4Android and looking for an easy fix to the problem, try this it works both Google maps and Openstreet even though OSM creates a bit of a messy result and thanx to [yndolok] for the google marker
GooglemLoc="https://www.google.com/maps/place/"&[Latitude]&"+"&[Longitude]&"/#"&[Latitude]&","&[Longitude]&",15z"
GooglemRute="https://www.google.co.ls/maps/dir/"&[FrmLatt]&","&[FrmLong]&"/"&[ToLatt]&","&[FrmLong]&"/#"&[ScreenX]&","&[ScreenY]&",14z/data=!3m1!4b1!4m2!4m1!3e0?hl=en" 'route ?hl=en
OpenStreetLoc="https://www.openstreetmap.org/#map=16/"&[Latitude]&"/"&[Longitude]&"&layers=N"
OpenStreetRute="https://www.openstreetmap.org/directions?engine=osrm_car&route="&[FrmLatt]&"%2C"&[FrmLong]&"%3B"&[ToLatt]&"%2C"&[ToLong]&"#Map=15/"&[ScreenX]&"/"&[Screeny]&"&layers=N"
2023 update:
I found a very easy way to implement this function.
From google maps, find your POI (point of interest) and click on it.
on left handside opening menu you will see an icon Share and click.
A modal opens and you see a sharing link input box. Next to it you will see Copy link. Go to your url and paste it like;
Drive to our office
Voila, you are done.