I want to embed a custom (shared) google map i've created with specific markers into my website using the Google map api and javascript. The public link to the map: https://www.google.com/maps/d/edit?mid=zsBifQnz-5Kg.kzYonBq-f6oo&usp=sharing
I know that it is possible with iframe. But I need to add some links later on with js to the markers as well.
If its not possible, is there any way to get all the geo location data lat, and long from my custom map to dinamycally create my map?
You could do this with the google-maps javascript API and directly use the KMZ or KML that you create off your custom map. Just go to the options in your custom map and click "Download KML". If you plan to continue to make changes to your map, I would suggest the network KMZ file. The maps-api has a library to use this KMZ directly only a map.
Related
I'm using Google map in my website to show marker and to draw marker I also use an extra JS markerwithlabel.js.
To initialize map what have I done
google.maps.event.addDomListener(window, 'load', mapInitFunction);
it working fine when I don't use third party resources.
For my business purpose I have to load some third party JS, images etc, sometimes one of these resources get loading. Because request status show pending. Consequently Google map not load. Since I have initialize map in window load. I read Google Doc but didn't get any
alternative way to initialize Google map without window load.
Any of your suggestion will be appreciated.
Use callback function method and put it at the end of body
<script src="https://maps.googleapis.com/maps/api/js?key=**YOUR_KEY**&callback=mapInitFunction" async defer></script>
You can use without async defer attributes as well. It just provides a way of lazy loading the google maps
I am writing a mobile angular javascript app that receives a message. The message contains some metadata about the message and also a url which points to a kmz file. Currently I use that kmz url to display a kmllayer via google maps inside my app.
kmlLayers[i] = new google.maps.KmlLayer({
url: kmlURLs[i],
suppressInfoWindows: false,
map: $scope.map
});
The kml currently contains style information similar to this:
<Icon>
<href>root://icons/palette-4.png</href>
<x>32</x>
<y>128</y>
<w>32</w>
<h>32</h>
</Icon>
I would like to override the Icon for this layer based on metadata that I receive in my inbound message. So instead of seeing a pushpin, I show an icon such as a store icon or a post office icon. Is there a recommended way to do this? Thanks!
I am trying to set the Google Map overlay from an image created at the browser instead of giving a URL. Is it possible?
Below is the example giving on one of the google help documents. As you can see they set the second parameter to the URL. I would like to use an image from memory rather than the URL. I have seen where when doing Android development that is possible with the GroundOverlayOption.image but I don't see that as an option using the JS V3 API.
Any suggestions?
var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
historicalOverlay = new google.maps.GroundOverlay(**'https://www.lib.utexas.edu/maps/historical/newark_nj_1922.jpg'**, imageBounds);
historicalOverlay.setMap(map);
Is it possible to embed google map with custom markers to a website just by iframe? I have google map on my website with markers and everything is working with some functions in javascript. It's okay but now I want to enable some users to add same map with same markers to their website. I want to do it very easy and with less code possible. So I want to give code to users that they add to site and everything would work. Is it possible with just iframe tag? Or I must give users code in javascript too? Or is there another way? Thanks
You may use Mapsengine to create the map, they may easily be shared via iframe. But there is no option to apply custom script-code.
Another approach: use a script-file that contains the code used with the map and that also creates the map. The users may embed this script instead of an iframe, the sharing would be as simple as when you would use an iframe.
is it possible to initialise a google map and then load the pins dynamically on it?
What I would like is a map where....as soon as the data is available, its marker pops up.
I am on a situation where the data come quite slowely so...it would me nice to give a feedback showing this partial results while the rest of the data come.
Thanks in advance.
is it possible to initialise a google map and then load the pins dynamically on it? Yes, use AJAX to load the markers (note, that link is to a page from Mike Williams' v2 tutorial, that API is deprecated, but the same concepts apply to the current v3 API).