capas de superposición de mapas de google

Question

estoy tratando de poner una capa encima de mis mapas de google para cubrirlo. No tiene que haber ninguna interacción con los mapas de Google, es solo una capa encima de la otra.

lo que tengo ahora:

<div id="map"> 
    <div id="overlay"></div> 
</div> 

en el mapa div puedo poner mis mapas de Google, y la capa de recubrimiento tiene un fondo tan grande como el mapa div, pero los mapas de Google mantiene ponerse en la parte superior.

¿Alguien una idea de qué puedo hacer al respecto?

Answer 1

La API sobrescribirá todo lo que esté dentro del DIV que asigne al mapa como contenedor. Para cubrir el mapa que había necesidad de poner su div superposición fuera del mapa div con position: absolute

Answer 2

API de Google Maps V3 es compatible con una opción llamada noClear:

Si es verdad, no borrar el contenido del mapa div.

usarlo como:

var myLatlng = new google.maps.LatLng(-34.397, 150.644); 
var myOptions = { 
    zoom: 8, 
    center: myLatlng, 
    mapTypeId: google.maps.MapTypeId.ROADMAP, 
    noClear: true, 
}; 
var map = new google.maps.Map(document.getElementById("map_canvas"), 
    myOptions); 

Sin embargo, semánticamente se siente mejor poner el div # superposición como el siguiente hermano del mapa div como sugiere @Marcelo.