Add Google "My Maps" Layer to Google Maps Javascript API - javascript

I want to put a Google Maps map on our website.
I know that custom markers can be added to a map with Javascript, but I'd rather use Google's MyMaps service instead, because then my co-workers could edit the map without any programming knowledge.
You can add a custom My Map to websites with an embedded iframe. I'm using the Javascript API instead though, so that I can take advantage of the controls the API delivers (such as zoom through custom controls or changing the position on the map without touching the map itself).
Can I insert the map created and saved with My Maps as a layer in my JS API map?

You can use GGeoXml to add My Maps content to your API map.
In your My Map there's a "View in Google Earth" link, use the URL of that link as your GGeoXml URL.
The link generates an indirect "network link" reference to the data, so the map on your page will reflect the latest changes made to the My Map.
The downside is that there's a limit to how many markers you can place on one page of a My Map, and the "View in Google Earth" link only returns data for the current My Maps page.

Another strategy is to use GeometryControls in your own API map.
That involves a lot more coding effort on your side. It gives the same look and feel to your co-workers, so they still need no programming skills. The advantage is that it bypasses the My Maps limit to the number of markers that can be displayed at once.

Apparently you can embed the My Map you created in your website by using the Link To This Page functionality as described here.

Related

Display place information with Google Maps Javascript API

I currently use Google maps embeds to display places information like this: https://developers.google.com/maps/documentation/embed/guide#place_mode
The big problem with embeds is the scrollwheel and mobile touch drag. Therefore, I'm converting it to the Javascript API where you can set options to take care of those issues. However, I need to know how to display places information as per the default google map style (I don't want to create my own custom infowindow and all).
How can I use the default places information display from google maps?

Prevent Google StreetView Javascript API returning custom panoramas

I'm building a tool that uses the javascript StreetView AND the StreetView Image API to return images that I can composite and share. I need the interactive panoramas that Google return from its API to match the static images I get from the Image API.
What I've found is that if the panoramas are created by Google and NOT the custom user panoramas that are sometimes returned, then everything is just fine.
Unfortunately, I cannot find a property that prevents Google from returning these custom user panoramas. It is usually when the user drags the Pegman in the standard map and then drops it that I get one of these custom panoramas.
Has anyone had to do this before?
Adding &source=outdoor to the static image url should do the job. You can also use the Street View Image Metadata part of the static street view image api to get the nearest panorama using the same method by parsing the json it returns.

Google Maps API V3 zoom in/out with a button outside the map itself

I'm working on a company website of an acquaintance of mine. The company has 7 offices spread all over the country. He has asked me to create a page listing these offices (with contact info, picture, etc.), and add a Google map to it with multiple markers that indicate the offices.
I've done so, but seeing as the zoom-level (a complete country) isn't really detailed, I was thinking about making the map zoom in to specific markers/offices when clicking on the office in the aforementioned list.
I however have no idea if there's a way to perform actions inside the map, from outside the map. Does anybody know?
The website is not live yet, but as an example, you can take a look at this link: http://www.inter-psy.nl/contact/contactgegevens
What I'd like to do is (for example) make the colored block/header perform a map zoom-in to a specific marker when clicking on it.
You must make the map-variable globally accessible, then you may perform any action on the map from anywhere in the page(e.g. map.setCenter() to center the map at a specific location or map.setZoom() to set the zoom-level)
To make the variable globally accessible remove the var-keyword when creating the map

maps on my own server with google maps api

I want to make a website that displays my map, has panning, zooming and other features.
The google API seems to be the right thing for me. Just one question : Can i use the google javascript api with my own map images on my own server. I dont want to use the actual google maps, just its capability to display zoomable/scrollable maps in a browser
Technically this may be possible using the Overlays section (Ground overlays allow image overlays on the map) of the API and hooking half a dozen events to handle the redrawing at different zoom levels, tiling, hiding the real information about whatever location Google Maps thinks it is showing, etc.
But it is definitely not designed for such purposes and I'm not sure if it would be legal to use it in that way, would have to read the license.
There are other alternatives out there that would be able to achieve this functionality without the level of work needed to get Google Maps to cooperate I believe.
No, I don’t think so.
You may also want to look at OpenStreetMap. I have seen custom map-images being used with its interface.
I think you'll find that the Google maps interactivity code is geared towards working with Google map servers for the underlying map. However, you could put your own layers over their maps and then serve up your own content so long as it used the same mapping co-ordinates.

How to use anyother map like google maps in UIWebView in iphone?

I have done google map in UIWebView and it works perfectly with routing stuff and all. But now i want to load some other map into the WebView and get all the features that i get from google maps. How can i do it?
For eg: I want to load this one to the UIWebView. http://stage.discoveritalia.it/conbipel/ .This is an italian map. I want to use it in the same way as google maps works in an iphone app. Plz help me.
Since you are using normal web-based Google Maps in a UIWebView and not UIMapKit you approach this as any other Google Maps implementation using JavaScript.
The way this is done is by defining a custom map tile layer. See the Google Maps API documentation for custom tiles for more information.
Note that beside the actual programming, you need to have (and the rights to use) the actual map tiles as well.

Categories

Resources