I am using Google Maps JavaScript API v3 with a KML layer to display a map with custom markers.
My map links to the KML file I published as a Google Site attachment. Once loaded, the map shows each of the PlaceMarks from the KML file correctly, but will not display the popup balloons.
Rarely when I click a pin it shows the balloon (5% of the time), then none of the other pins work. When I zoom in and out my custom pin images sporadically revert to the default pin image.
I added the layerOptions to explicitly set clickable to true and suppressInfoWindows to false. It didn't change the balloon behavior.
I have tested with Chrome v19, Firefox v12, and IE8.
Update 1:
I found a typo in my KML, (bal*l*oon). Still not working right. Something is making the pins buggy.
Update 2:
v3 is now working. Google's caching made this difficult to test. Added '?nocache=0' to KML URL to prevent caching. BaloonStyle was the problem, but caching caused the typo to remain. Migrating KML to personal server.
Live HTML Map Page (Fixed)
Live KML Download (Fixed)
My references:
http://developers.google.com/maps/documentation/javascript/reference
http://ge.images.alaska.edu/workshop/advanced.htm
Google is caching your KML on purpose. The workaround is to append something like the current time to the end of your URL so that it is different every time:
var kmlFile = 'http://www.myserver.com/my.kml?'+(new Date()).getTime();
var kmlLayer = new google.maps.KmlLayer(kmlFile);
kmlLayer.setMap(myMap);
My problems:
A typo in my BalloonStyle tag
A stale cache of my KML file
This would have been easier if:
Google Maps JS threw errors when parsing KML
Google caching was reasonably fast
I started testing on a server
Update:
I moved the KML file to my server, but the cache remained stale after the first change. It seems the caching occurs when my Google Map object loads the KML overlay. I made sure it was not my system or my server caching.
The pins start acting buggy if I make a change to my KML and the cache doesn't update. All my pins show in the correct location, but one of the pins won't have a balloon. Changed the file name, works fine!
Update 2:
I reported this caching behavior as a bug on Google Maps JS API.
http://code.google.com/p/gmaps-api-issues/issues/detail?id=4196
Conclusion:
I wrote the ASP.NET/C# class to geocode addresses and build the KML doc in less time than it took to find this error.
Stop caching so hard Google!
Your KML is invalid. <Name> is not part of the spec. Change it to <name> and you should be good to go.
Related
When displaying a Google Map with Maps JavaScript API v3 activated, the default "Map" view works well, but the "Satellite" view does not : The image tiles read "Sorry, we have no imagery here".
I have two versions of the map : The public version works well either in Map mode or Satellite mode.
The private version, that requires login and allows for editing the custom stuff loaded onto the map, is the one that says "no imagery here" but only in Satellite mode.
When in private mode for editing, here is an example of working Map view :
Here is an example of broken Satellite view :
When looking at the Javascript console, here is what I find :
GET https://khms1.googleapis.com/kh => Error 400 Bad Request
But the request is sent by Google's own js code.
My web app has been working fine for years until I noticed this.
In case you are using a prototype js library, check in your developer console if you are receiving an error from Array.from function, if so, fix this bug in the overrided function or just comment it (at least to test it).
I had the same issue. I tried every available solution on the internet. Turns out Google tag manager was the culprit. How did I come to this conclusion? I opened the network tab in chrome and blocked all the js files from loading. I enabled them one by one and checked if satellite view was loading. For me Google tag manager js file was causing the issue.
I am working on loading KML files into a map using Google Maps API v3. The KML loads fine and the markers are seen. But the marker info (pop-up when the marker is clicked) never shows up in a consistent manner. A few work some times, some others don't. This is really peculiar. To see the page, check-
http://www.sobitabraham.com/teawap/NEW_kml.html
The KML file is here-
https://sites.google.com/site/teawapdata/home/kml-files/TEAWAP.kml
The KML file is 990 KB in size, so it is not some file size ceiling problem. It could have something to with the caching of KML, I am not sure. The KML file was exported from Google Earth.
The frustrating thing is that this marker behavior is erratic, the error is not consistent. This problem is seen even when I paste the URL of the KML file into maps.google.com. Any help in sorting this out will be appreciated.
Thanks.
I have created a webpage http://babysoftblog.co.cc/shahma/kmz/map_sexten.html in html5 with offline cache.its showing google map using a kmz file.the page is working fine online..but its not showing google map when page is o[en offline.
Am i doing any mistake?
Google Maps can't be used offline like that. Google Maps is much more than just the initial Lib, for example images, location data etc. If your website doesn't require all the navigation feature, I recommend check out Static Map API.
Initially you include the static map, which is just image file that can be cached offline, then check for connectivity status and load the dynamic map later (aka Progressive Enhancement).
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
This is driving me crazy. I've been developing some simple embedded Google Maps such as the following:
http://publicworks.snoco.org/rdclosures/snocordclosuregmaps.html
This map in particular has several kml overlays but one of them is no longer displaying the custom placemark icons I had developed and specified. The problem KML layer is this:
http://publicworks.snoco.org/RdClosures/SnocoRdClosures4Gmaps.kml
Some time in the last few months, the custom symbols stopped displaying and have been replaced by the default placemark symbol. If you open the KML file in Google Earth, it displays properly. The KML file does validate using KmlValidator.
Through my searches on here, I saw a suggestion about using definitions at the top of the KML file and then using within each Placemark. I made that change to my KML but it did not appear to make any difference (the custom icons are still not displaying).
I realize that KML files get cached on Google's end so if you look at my javascript code, I'm using the dummy parameter trick with my KML URL path to force a refresh of the layer. The other thing I will note is that the content of this KML is not static and it frequently changes.
Any ideas? Because I'm stumped!
THANKS!
Steve
Agreed with fragileninja that something is happening with your images between your server and Google's. The usual suspects are timing out and 404s (or other server errors).
Since the KML layer is actually being rasterized to tiles on Google's servers, the request has a relatively short timeout so the tiles aren't delayed from being sent to the browser. If the icon images aren't returned in that time, usually Maps will render using the default icon (as it's doing here). However, I also have no trouble getting the icons to work when I host them on my own server, and I don't see atrocious loading times when I access your icons directly, so it is strange.
It's possible that your servers are taking a longer than usual time to respond to Google's servers specifically, or even that they're returning some HTTP error to them instead of an image.
Can you check your server logs to see if you can see the requests and if they're returning as expected?
Finally, if there's no problem there, I would suggest filing a bug on the Maps API issue tracker. Make sure to pick the appropriate template from the dropdown list (you might also consider making a simpler test case, like just using your KML file with the KmlLayer example from the docs) . If you do end up filing a bug, please link it here and I'll make sure it's looked at.
It's something to do with how your server is serving up the images. If I host the icons on mine, it works fine, and your other KML files are using icons from maps.google.com, which also works fine.
Since it works in GE, I'm guessing maybe your server is sending the wrong MIME type or something along those lines. I checked with curl and everything looks fine though, so I'm afraid I can't offer any more details than that. Hopefully this helps get you in the right direction. Good luck!