Mis favoritos | Español | Acceder

Guía del programador de Google Mapplets

Los mapplets son miniaplicaciones que se ejecutan dentro de Google Maps. Cientos de programadores ya han creado mapplets con información superpuesta como fotos, condiciones meteorológicas o el precio de la gasolina en el mapa. Encontrarás estos mapplets y muchos más en el Directorio de Google Maps.

Los mapplets son nuevos, así que si se te presentan problemas al usarlos, nos gustaría leer tus comentarios. Te animamos a unirte al grupo de debate sobre el API de Google Maps para que nos envíes tus comentarios.

  1. Audiencia
  2. ¿Qué son los mapplets?
  3. Herramientas importantes para programadores
  4. Creación de mapplets
  5. Publicación de mapplets
  6. Instalación y ejecución de mapplets
  7. Uso compartido de mapplets
  8. Envío de mapplets al directorio
  9. Diferencias entre los mapplets y el API estándar de Google Maps
    1. Inicialización más rápida
    2. No se permiten comportamientos no estándar
    3. La comunicación con el mapa es asincrónica
    4. Asuntos de seguridad y saneamiento de la ventana de información
    5. Google protege mediante proxy las solicitudes de datos remotos
    6. Conversión de una combinación de datos del API de Google Maps existente en un mapplet

Audiencia

Esta documentación está diseñada para personas familiarizadas con programación JavaScript y conceptos de programación relacionados con objetos. Los mapplets son un tipo especial de gadget, por lo que también es necesario consultar la documentación del API de gadgets.

Hemos organizado la documentación recientemente para añadir más información conceptual y tratar las siguientes áreas básicas:

Los nuevos programadores deberían leer tanto este documento, donde se explica cómo instalar y publicar mapplets, como el documento El "Hello, World" de los mapplets , donde se explica cómo escribirlos. Si ya estás familiarizado con el API de Google Maps, te interesará consultar la sección sobre diferencias entre los mapplets y el API estándar de Google Maps. En esta guía no se presupone que estés familiarizado con el API de gadgets o con el API de Google Maps.

¿Qué son los mapplets?

Un mapplet es un archivo XML que envuelve una minipágina web. Dentro de esta minipágina web puedes colocar cualquier cosa que puedas poner en una página normal, incluido HTML, JavaScript y Flash. Google proporciona un API de JavaScript que permite al mapplet comunicarse con el sitio de Google Maps, extraer contenido de sitios web remotos y almacenar las preferencias del usuario.

Cuando un usuario ejecute tu mapplet, Google extraerá el código fuente del mapplet de tu servidor web y, a continuación, mostrará la minipágina web en un IFrame en el sitio de Google Maps. Por motivos de seguridad, la minipágina web se alojará en gmodules.com.

Para reducir la carga de tu sitio, gmodules.com almacenará en caché el código fuente del mapplet durante varias horas. La única forma de omitir el almacenamiento en caché es instalar el Developer Mapplet (mapplet del programador).

Herramientas importantes para programadores

Antes de empezar a escribir un mapplet, debes dirigirte a la sección Herramientas para programadores del Directorio de Google Maps y añadir las siguientes herramientas:

  • Developer Mapplet: cuando se instala esta herramienta, se añade un enlace de recarga a cada mapplet que se ejecute. De esta forma se podrá omitir el almacenamiento automático en caché del código fuente del mapplet. Créenos: si no instalas la herramienta Developer Mapplet, acabarás saturado muy pronto.
  • Mapplet Scratch Pad: esta herramienta te permite escribir código de mapplet de forma interactiva y obtener una vista previa inmediata. Puedes cortar y pegar todos los ejemplos de esta guía en Scratch Pad.

Creación de mapplets

Cuando hayas configurado correctamente tu entorno de programación, el siguiente paso es escribir el mapplet en sí. Un mapplet no es más que código JavaScript colocado en un gadget especial de Google diseñado para comunicarse con el mapa principal de maps.google.com. Encontrarás instrucciones detalladas para escribir tu primer mapplet en la sección El "Hello, World" de los mapplets de Conceptos básicos de los mapplets.

Publicación de mapplets

Debes guardar el mapplet en un sitio web público. Si no tienes uno, te recomendamos que pruebes Google Page Creator. Pero no utilices el editor WYSIWYG. Dirígete a Site Manager y utiliza el enlace upload situado a la derecha. A continuación, haz clic en el nombre de archivo de la sección Uploaded stuff para obtener la URL de tu mapplet.

Instalación y ejecución de mapplets

Para ejecutar un mapplet, primero debes instalarlo. Para ello, dirígete al Directorio de Google Maps y haz clic en el enlace Añadir por URL situado junto al botón Buscar contenido de Google Maps en la parte superior de la página. A continuación introduce la URL de tu mapplet y haz clic en el botón Añadir. El mapplet aparecerá en la ficha Mis mapas cuando vuelvas a Google Maps.

Uso compartido de mapplets

Utiliza la siguiente URL para permitir que otros usuarios puedan ejecutar tu mapplet:

http://maps.google.com/ig/add?synd=mpl&pid=mpl&moduleurl=< URL of your mapplet>

Los usuarios que hagan clic en esta URL accederán a una página en la que se les pide que instalen el mapplet. Por ejemplo, si el código fuente de tu mapplet está situado en http://www.google.com/mapfiles/mapplets/distance/distance.xml deberás compartir la siguiente URL:

http://maps.google.com/ig/add?synd=mpl&pid=mpl&moduleurl=http://www.google.com/mapfiles/mapplets/distance/distance.xml

Envío de mapplets al directorio

Si deseas que tu mapplet se incluya en el Directorio de Google Maps, utiliza este formulario de envío. Nuestro objetivo es llenar el directorio de mapplets de gran calidad que resulten útiles y divertidos para los usuarios. Aunque no podamos incluir todo lo que recibamos, queremos incluir todo lo posible.

Diferencias entre los mapplets y el API estándar de Google Maps

Las llamadas del API para manipular el mapa se derivan del API de Google Maps estándar y son casi idénticas. Sin embargo, debes tener en cuenta las siguientes diferencias sutiles.

Inicialización más rápida

<Require feature="sharedmap"/> Inicializa automáticamente el API sin tu intervención, de modo que no tendrás que cargar manualmente la biblioteca JavaScript ni hacer pasar una clave de API. No tienes que pasar un <div> al constructor GMap2 puesto que siempre devuelve una referencia al mapa principal.

Si un usuario ha cargado tu mapplet, podrás suponer sin temor a equivocarte que está usando un navegador compatible con Google Maps, por lo que no es necesario la comprobación GBrowserIsCompatible, que los mapplets no admiten.

En el API de Google Maps, hay que "inicializar" el mapa posicionándolo mediante un método setCenter(). Este posicionamiento no es necesario en los mapplets, que ya tiene un mapa inicializado de forma precisa.

No se permiten comportamientos no estándar

No se admite que los mapplets cambien el comportamiento estándar de Google Maps, por lo que hemos eliminado los métodos para desactivar el arrastre, para acercar la imagen con doble clic, etc.

La comunicación con el mapa es asincrónica

La comunicación entre los mapplets y el sitio de Google Maps es asincrónica. Por lo tanto, algunos métodos tienen un comportamiento distinto a sus equivalentes en el API de Google Maps. Como norma general, las operaciones que modifican el mapa (por ejemplo, setCenter(), addOverlay()) son idénticas a las operaciones del API de Google Maps. Sin embargo, las operaciones que obtienen un valor del mapa requieren una función de devolución. En los mapplets adjuntamos Async al final de los nombres de todos los métodos del API de Google Maps que se ven afectados por esto, y los valores devueltos se pasan como argumentos a la función de devolución.

Por ejemplo, en el API de Google Maps habría que escribir:

var zoom = map.getZoom();
alert("Current zoom level is " + zoom);
alert("This happens after you see the zoom level message");

Por su parte, en un mapplet esto habría que escribirlo así:

map.getZoomAsync(function(zoom) {
  alert("Current zoom level is " + zoom);
});  
alert("This might happen before or after you see the zoom level message");

A menudo tendrás que realizar varias solicitudes asincrónicas a la vez. En lugar de realizarlas en serie o de anidarlas unas dentro de otras, los mapplets proporcionan una función GAsync() para realizar varias solicitudes en una sola llamada. Para utilizar GAsync(), pasa un objeto y los métodos para llamar entre comillas a continuación de ese objeto, con una función de devolución como argumento final:

GAsync(map, 'getZoom', 'getCenter', function(zoom,center) {
  // code here
}

Para realizar solicitudes en más de un objeto, pasa los objetos adicionales con los métodos entre comillas inmediatamente después del objeto:

GAsync(map, 'getZoom', 'getCenter', marker, 'getPoint',
  function(zoom,center,point) {
  // code here
}

Asuntos de seguridad y saneamiento de la ventana de información

El mapplet se ejecuta en una iframe alojada en gmodules.com, por lo que no puede acceder a las cookies del usuario de Google ni interrumpir el código JavaScript del sitio de Google Maps. Sin embargo, el mapa (y todo lo que se muestra en él) se aloja en el dominio maps.google.com, así que si un mapplet solicita que mostremos una ventana de información, saneamos el contenido de la ventana de información antes de suministrarla al mapa. No se permite JavaScript dentro de las ventanas de información y sólo se admite una lista de inclusión de etiquetas HTML y estilos CSS.

Es más, las operaciones como añadir nuevos controles de mapa o tipos de mapa requieren actualmente que se ejecute código JavaScript de terceros dentro del mapa, por lo que de momento las hemos desactivado.

Google protege mediante proxy las solicitudes de datos remotos

Los mapplets se suministran desde gmodules.com, que está situado en un servidor de Google. El modelo de seguridad del navegador no permite que el código JavaScript de gmodules.com pueda solicitar datos de ningún otro dominio, por lo que no podrás usar GDownloadUrl (ni GXml) dentro de tu mapplet para recopilar datos desde tu servidor.

En su lugar, el API de gadgets proporciona las siguientes llamadas que recopilan contenido mediante un proxy que se ejecuta en gmodules.com:

Estos métodos funcionan de distinta forma que GDownloadUrl y GXml en estos aspectos:

  • Las llamadas _IG_FetchContent y _IG_FetchXmlContent pueden recopilar datos de cualquier sitio web de Internet.
  • _IG_FetchXmlContent es más estricta que GXml y requiere que el archivo XML comience por <?xml version="1.0" encoding="UTF-8"?>
  • Las llamadas _IG_FetchContent y _IG_FetchXmlContent guardan automáticamente en caché el contenido y reducen la carga de tus servidores. Consulta la sección acerca de la actualización de caché de la documentación del API de gadgets para obtener datos sobre cómo cambiar la duración de la caché o sobre cómo desactivar el almacenamiento en caché.

Conversión de una combinación de datos del API de Google Maps existente en un mapplet

Si ya tienes un sitio creado en el que se utilice el API de Google Maps, consulta el artículo sobre conversión de un mashup del API de Google Maps en un mapplet.

Continúa en Conceptos básicos de programación de mapplets.