google-maps - marcar - google.maps.marker example

¿Cómo puedo colocar un div html sobre el plugin de Google Earth? Implica wmode, me imagino

Question

Tengo problemas para colocar un html div sobre el complemento de Google Earth en una aplicación web, cualquier ayuda sería apreciada.

Está bien para el modo Mapa, Terreno e Híbrido, pero en el modo " Tierra ", el flash se activa y automáticamente coloca el mapa en la parte superior .

Z-indexing no ayuda.

Presumiblemente podría hacer algo como:

document.getElementById(''flashDiv'').setAttribute(''wmode'', ''opaque'');

pero dado que las cosas de Google se compilan sobre la marcha, lo hace mucho más difícil. Ver el código generado no ha ayudado aquí. De nuevo, debido a que se compila sobre la marcha, cosas como SWFObject no pueden salvar el día ...

¿Alguien ha encontrado algo similar? He pasado la mañana rastreando el grupo API de Google Earth sin mucho provecho.

Actualización : después de más tirones de pelo, la respuesta puede recaer en una cuña iframe . También pude haber llegado a la conclusión de que el complemento está basado en Flash. Investigando ...

texto alternativo http://neilsimonmckeown.googlepages.com/overlay.jpg

Answer 1

Si se trata de un complemento, entonces no puede colocar de manera confiable otros elementos encima de él. Los navegadores suelen soltar la mayor parte de su capacidad de elementos de "capa" cuando se trata de complementos.

Supongo que un iframe puede ser una forma de evitarlo, siempre y cuando compruebe que esto todavía funciona en la mayoría de los navegadores.

Answer 2

Después de investigar la forma en que Google hace que los usuarios inserten el código, parece que está con un iFrame. Aún así, si tiene algún problema con un flash, consulte a continuación ...

Se ejecuta en situaciones similares al intentar mostrar un menú desplegable sobre un elemento flash (o html sobre un video de YouTube). Hubo algunos factores que entraron en juego.

El primero era que mi elemento html que quería pasar el cursor sobre el elemento flash tenía que ser un elemento hermano html con las propiedades css establecidas para cada elemento hermano y también para el div principal. Así por ejemplo:

<div id="parent">
  <div id="sibling"></div>
  <embed id=”flash”><other script code></embed>
</div>

Entonces mi CSS sería

//.parent may not need to be set to relative
#parent   { position: relative; }
// the value on sibling1 just needs to be higher than .sibling2
#sibling  { position: relative; z-index: 20; }
#flash    { position: relative; z-index: 10; display:inline }

Otra cosa que vale la pena destacar es que su flash necesita tener el parámetro wmode configurado en transparente.

Este truco ha funcionado para varias aplicaciones de flash y videos de YouTube. El truco es asegurarse de que el html que desea mostrar sobre el flash sea un elemento hermano del código flash real y no del div principal, el índice Z para el html para mostrar sobre el flash es más alto que el elemento flash, ambos elementos html tienen su posición establecida en relativa o absoluta, y el parámetro wmode se establece en transparente.

Espero que esto ayude, pero supongo que su problema es con el iFrame.

Answer 3

No hay soporte directo para superponer ''divi-z'' a div en el Api o Dom. El complemento carga un archivo ejecutable que, en términos muy simples, perfora un agujero en la ventana del navegador. Usar la técnica ''iframe shim'' es la solución estándar aunque la transparencia puede ser complicada.

Hay una solicitud de función abierta para que esta funcionalidad se agregue a la API: la sección de comentarios contiene buena información y enlaces.

Además, hay una gran demostración en línea de esto aquí

Answer 4

Arreglé una demostración que muestra cómo usar calzas IFRAME aquí:

http://earth-api-samples.googlecode.com/svn/trunk/demos/customcontrols/index.html

Answer 5

establecer el índice z "iframe" en 100

y configure div que se muestra en la parte superior z-index en 200 (div debe estar al menos en posición relativa)