Incluir imagenes en Google Maps

06/Jun/2007 Google , 2 Comentarios

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

Difunde el Conocimiento

Si te ha gustado el artículo o te ha sido de utilidad, no dejes de compartirlo con tus amigos en las redes sociales... Te estaremos muy agradecidos. :-D

2 comentarios en “Incluir imagenes en Google Maps”

Víctor Cuervo

stanelliott

Según lo descrito arriba, no sólo debes asignarle la imagen, sino el tamaño también dentro del código.

Víctor Cuervo

Dosunocero

Hola.
Tengo una pregunta sencilla. Por más tipos de iconos que pongo, por más extensiones distintas de los mismos; los iconos en maps siempre se alargan y no quedan bien. ¿Alguien sabe por qeu ocurre eso?
GRacias

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*