Google

Incluir imagenes en Google Maps

06/Jun/2007

Si ya hemos aprendido a «Cargar Google Maps» en nuestra página web. Veremos que nos empiezan a aparecer nuevas necesidades para crear nuestros Mashup.

Una de las posibilidades que tenemos con Google Maps es la de incluir imágenes en una determinada posición.

Para poder añadir una imagen lo primero que tenemos que hacer es crear una instancia de la clase GIcon. Veamos la línea de código:

icono = new GIcon();

Al icono podemos configurarle múltiples propiedades: URL del icono, el tamaño del icono, el icono que hace de sombra, el tamaño de la sombra, si vamos a desplazar el icono dentro de la posición de ubicación del mapa,…

Al menos deberemos de indicarle la URL del icono (.image) y si vamos a desplazarle dentro de su posición dentro del mapa (.iconAnchor).

De esta manera el código podría quedar de la siguiente forma:

icono.image="http://labs.google.com/ridefinder/images/mm_20_red.png";
icono.iconSize = new GSize(12, 20);
icono.iconAnchor = new GPoint(2, 2);

Hay que indicar que el tamaño del icono se tiene que indicar mediante la clase GSize y la posición del desplazamiento mediante una clase GPoint.

Una vez que tenemos creado el icono, deberemos de crear una localización en el mapa. Hay que recordar que las localizaciones se montan mediante la clase GLang. Que es la misma clase que se utiliza para cargar el mapa.

// Creamos la ubicación
punto = new GLatLng(40.656192,-4.688158);

Los valores que se utilizan son los de longitud y latitud.

Solo nos quedará el incluir al icono en la ubicación especificada. Esto se hace mediante la clase GMarker, la cual recibe como parámetros la localización y el icono. GMarker lo posiciona en el mapa.

// Añadimos el icono en la ubicación
map.addOverlay(new GMarker(punto,icono));

Visualizar el ejemplo | Descargar el código

Suscribir
Notificar de
guest
2 Comentarios
Recientes
Anteriores Más votados
Opiniones integradas
Ver todos los comentarios