Mark a place on Google Map and embed widget - html

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).

Related

Integrate Instagram pictures to google maps

I don't know if this is the place to ask for this kind of stuff but i'll try.
I want to integrate a map of google maps embedded in my website that shows my geotagged instagram pictures on it.
There are some online services but none is exactly doing what i need which is so basic at the same time.
I found a widget called snapwidget where you can manage to show your pictures in the map, but then you have no option to set the zoom of the map and the controls wont' appear.
Is there any way to show and set the zoom controls in a embedded google map which is not directly from google maps api?
Well according to the Embed API documentation you can set optional parameters for the zoom level and other settings. I don't see anything to disable the controls, and I don't know about integrating with Instagram photos.
e.g.
https://www.google.com/maps/embed/v1/view
?key=YOUR_API_KEY
&center=-33.8569,151.2152
&zoom=18
SnapWidget is one option, but then there's also Widgetic and The Data Pack.
http://thedatapack.com/embed-instagram-map/

How to make links to the new Google Maps, with coordinates

Google recently changed Google Maps UI, and now the links I use does not work anymore.
I've tried searching, but I haven't been able to find info om how i should build links to the new Google Maps. I only find info on integration, and static image maps, which still works, but I want to be able to click on the image to get to the full Google Maps.
This is the format I used earlier:
https://maps.google.com/maps?z=16&t=h&q=loc:48.854013+2.350232
Does anyone know how I can get that work again, or preferably, a link to the entire documentation?
Here is the API for Google Maps Embed API
check the new link structure.
https://www.google.com/maps/embed/v1/view
?key=API_KEY
&center=37.4218,-122.0840
&zoom=18
&maptype=satellite

How do you shift the centre of the map in an embedded Google map?

I have a Google Map that I have embedded on my web site. I have managed to size and position the iFrame so that it sits where I want it to sit on my web page. I am using the new Google Maps version.
However, I want to be able to shift the centre of the map to the right, because as it standsnow, the box that displays the map layers is covering some of the locations I have marked.
I am not at this point using any Javascript or jQuery. I have simply taken the iFrame link provided by Google's embed feature and placed it in my HTML. I see there are other questions about map centering, but I can't parse them for my situation because they assume some Javascript implementation. Also, I'm hoping that I do not have to take on a whole API or Javascript library to solve this. Further, it is unclear to me if the other questions relate to the new Google Maps version, which is what I'm using.
Is there a way I can alter the centre of the embedded Google Map?
Just add a "center" parameter to your iframe url. Like so - center="40.714728,-73.998672". You can get the required coordinates by searching in google maps and picking them from the address.
You could alternatively also use a query parameter but center is more accurate.
refer - https://developers.google.com/maps/documentation/static-maps/intro#location

New Google Maps embedding option

Since the latest Google Maps update in 2013, is there a way or a resource that can be used for simple embedding Google Maps?
I have tried using the old maps system but it does not produce desired results.
Also, I have tried using Google Maps Engine, no luck there as well, because you are only served with a link to share, not embed code.
After extensive research on the topic I found no simple way of embedding new Google Maps. Problem will possibly go away once Google decides to update Google Maps. However, I have not seen Google Maps development roadmap and so I can't really vouch for them.
Apart from using simple solution, there are two others (not so simple of course) that might provide a decent substitution.
Solution 1
Using Google Maps API where you can find Developer guides, API reference and code samples. There is no easy way about this, simply follow the instructions and review examples that Google has supplied. Hopefully there might be something in it that will help you.
Simple guide to Google Maps API
Solution 2
Using Google Maps Engine will offer you a way to create your own map. Once you have created a map, added pins, points, routes, etc. at the end you can select option to share. However, option to share just allows you to share a link, not embed. I just wanted to point out this "feature", if you will, of the system.
To embed a map you have to click on a folder in the upper left corner. Shown on the image below and select Embed on my site option.
In the bottom right corner of the map you'll see a cogwheel. Click it.
Click on "Share and embed map";
Choose the size you need from the drop-down menu or choose the custom option;
Click in the box to the right that starts with <iframe src="https://www.google The code should be highlighted. copy and paste it into your web page or blog.
Simples!

Query existing, public Google Map via the Google Maps API v3

I am trying to embed an existing, public Google Map into a website. Specifically this one:
http://goo.gl/maps/cHf2
Of course I could use the iframe embed to achieve this, but I would like a little more control over the map … I imagined being able to pull all the markers from the map and display them as an index next to the map. Kind of like Google already does, but embedded in my page with my own styles and images.
I have been digging through Google, Stack Overflow and the API instructions and couldn’t find any relevant posts. In the GET string of the map on Google we can see this chunk:
&msid=212828439842926497866.0004bfae4da003d8ffd1f&mid=1341413217
I thought in there might be a maps ID and I could use it to query the content of the map through the API? The intention is using Google Maps as a CMS for less technical minded people and not dealing with geo data in our own CMS.
Any help would be greatly appreciated. Maybe I am just missing the forest for the trees.
You can download the kml that specifies the markers in that page and display that on your API based map. This example defaults to displaying it using geoxml3, but you can hide that and display the KmlLayer version.
You should be able to just point KmlLayer to the link (I downloaded the kml and put it on my server so it would work with geoxml3).
Here is an example (taken directly from the documentation) that does that
here is the original