Ordering / z-indexing overlays on Google Map - javascript

I'm adding 2 overlays - a Demographics Layer and a Fusion Tables Layer - to a Google Map. The problem is that I need to order these layers so the Fusion Tables Layer is always on top of the Demographics Layer. It seems that whichever one I call "setMap(map)" on last is on top, but I have functionality for toggling the Demographics Layer on or off using setMap(null) and setMap(map)... but whenever it is toggled on using setMap(map), it shows up on top of the Fusion Tables Layer.
if (checkbox.checked) {
demolayer.setMap(map); //added on top
} else {
demolayer.setMap(null);
}
Is there another way to order overlays besides making sure you call setMap(map) on the layer you want on top last? I've tried z-index properties with no luck. Any help is much appreciated.

You wrote:
Is there another way to order overlays besides making sure you call setMap(map) on the layer you want on top last?
Not that I have seen. The work around is to always remove both layers and add both back in the order you want them displayed.
You might want to "star" these enhancement requests or adding a new one (I don't see a general "allow control relative z-index of layers" enhancement request):
http://code.google.com/p/gmaps-api-issues/issues/list?can=2&q=layer+z-index
http://code.google.com/p/fusion-tables/issues/list?can=2&q=z-index

Related

How can a put a static picture over Google Dynamic Map?

I have added a Google Maps Javascript API (dynamic map) to my web-site. I want to put a static picture in the bottom left corner over the maps div - something like a legend. It will not move when the user scrows around.
Is there a way to do it through Google Javascript API or shall I just add a div, put it over the map with CSS?
Yes, there is a way to add this sort of thing using the Google Maps Javascript API. It is considered a Custom Control, and here is a link to the documentation. You would do that if you need to have your element move around when screen real estate gets tight and you want Google Maps to take care of it.
If you aren't concerned with reflowing the other controls as the map appears on screens of various sizes, you can just go with an absolutely positioned element. If you don't want your overlay to affect the map ui by capturing mouse events, just set pointer-events:none; on that element.

Add multiple tilesets of same area to same style in mapbox

I am working on a project to show variation in NDVI values of a district in India on a fortnightly basis on Mapbox. For that I need to overlay a layer of tileset showing NDVI values of that district upon a map of India. The problem is that I have to do it for a couple of tilesets (Around 50) of the same district. One way is to use different styles for different tilesets. But it is limited to 20 styles for a free account. Other way is to use same style and overlay the different layers of 'NDVI maps' one upon other. But in that case I'm only able to see the topmost layer. Rest of the layers of same district are not visible. I see that there are two possible solutions.
Find a method to put/show a particular layer on top at a time. Rest of the layers would be below the current layer, hence would not be visible.
Find a method to automate the addition of a tileset to a style and reset the style (means delete or hide the previous added layer) and add a new layer and show it.
Please help. If the question is not clear, please inform.

OpenLayers: destroyed features reappear after zooming in or out

I have an OpenLayers + Bing mapping application that shows hazardous waste sites. A user can click a link to toggle a site's subsites on the map.
When I toggle the subsites off (which are points on a Vector layer) by calling destroyFeatures() on the layer, they disappear as expected. However, if I zoom in or out on the map, certain of the subsites reappear. This doesn't happen when moving the map, just zooming.
The ones that mysteriously reappear are coincident sites, i.e. two sites with exact same coordinates. Both get destroyed, and both reappear.
Why would these get destroyed from the layer, then reappear when zooming?
(OpenLayers version is 2.11)
Try this, it worked for me
layer.removeAllFeatures();
layer.destroyFeatures();//optional
layer.addFeatures([]);
Keep in mind that destroyFeatures() changes index of objects in vector. If you use indexes in your code, this may cause problems.
Are you sure you send ALL features as a parameter to destroyFeatures() method? An easier way to remove everything is just to call removeAllFeatures() method. If you want to hide and show features when user toggles subsite then it's even better to use show() and hide() methods on vector layer.

Google maps styling query

I've played around with the FusionTablesLayer Wizard (http://gmaps-samples.googlecode.com/svn/trunk/fusiontables/fusiontableslayer_builder.html) to create a map of wind turbines in North Devon.
http://www.thisisnorthdevon.co.uk/images/localpeople/ugc-images/275834/binaries/WindTurbines.html
But there are two problems.
The first is that the styling that I'd created within the Fusion Table layers has not carried through. Is there a switch to force the layer to take on this styling?
The second is that I don't want the shapefile layer to be clickable. How do I turn this off?
But there are two problems.
The first is that the styling that I'd created within the Fusion Table layers has not
carried through. Is there a switch to force the layer to take on this styling?
Not sure what styling you are asking about. Is it styling defined in the FusionTable? By the FusionTables Wizard? It looks like you may be missing the application of the styles to the map this or the equivalent:
map.setOptions({styles: styles});
You might want to review the documentation on styling the map
The second is that I don't want the shapefile layer to be clickable. How do I turn this off?
To disable clicks on that FusionTablesLayer, use the suppressInfoWindows option when you construct it.
your page with infowindows suppressed on the polygon layer and styling, note that your html is invalid (no body).

Google Maps - Changing the pane order of tile overlays?

A continuation of my previous question: How to change the layering of KML and Tile Overlays in Google Maps?
I am currently rewriting some of the code regarding the buttons which enable and disable tile overlays using arrays. In doing so, I'm trying to combine all of the button's individual functions into a single function, but since I have two methods of rendering the overlays, I was hoping to try and simply focus on only one method. The first uses "overlayMapTypes":
map.overlayMapTypes.insertAt(0, beloitMapType);
The second, using a script provided in my previous question:
this.getPanes().overlayShadow.appendChild(this.settings.div_);
The former method is my original approach; however, since I use polygons on the Satellite view I needed a way to place icon/name overlays above the colored polygons. To achieve this, I sought something akin to the latter method where certain overlays could be placed onto a pane higher than the polygons and thus appear above them.
However, in the time between my previous question and now, as well as through some of my own research, I've come to realize that the latter method, rather than placing the tiles into their places, estimates the location of the tile and places it as an image overlay. As a result, a part of my accessibility layer which colors in inaccessible paths had been misaligned by a pixel or two, or my building name overlay currently has names on the border of two tiles which have a sharp line through them as those two tiles overlap slightly. In addition, these two issues come and go each time the map is loaded with each tile being placed on the map with a variance of 1-2 pixels in any direction.
Thus, I would very much prefer to use the former method with overlayMapTypes, which is more reliable and accurate, on all of the overlays, but I also need a way to bring some of these overlays higher than the "overlayLayer" pane and above the polygons. Is this possible and, if so, how could it be done?
Addition: I have an additional need to try and find a method to achieve the reassignment of panes with the overlayMapType method: the script I'm using to achieve this doesn't appear to work in IE7/8. I'm going to investigate this angle myself, but I'd still prefer to drop the script entirely if possible.
Well, I've hit upon a possible solution and, for the sake of sharing it, allow me to explain:
Polygons do not necessarily need to be visible to still have click and hover events.
Since the polygons are used to color the buildings and poi in Satellite view, such a visual component could easily be done by an overlay.
Thus, a possible solution is to have all polygons invisible and simply use them for click and hover events. Likewise, a second overlay, or a modification of an existing one, would replace the polygon's original visual component. Since this visual component is now an overlay like everything else, it can be easily layered with any other overlay using the "MapType" method.
(This however doesn't answer the question; namely, can tile overlays and polygons be layered only with the MapType method? I would still like to know that, but in the event that there is no answer, this hopefully is a possible alternative.)

Categories