Una ves comprobada la compatibilidad creamos el objeto GMap2 pasandole como parametro el id del div donde se va a mostrar el mapa...
var map2 = new GMap2(document.getElementById("map2"));
Y por ultimo centramos el mapa en una latitud y longitud pasada como parametro por medio de GLatLng...
map2.setCenter(new GLatLng(37.4419, -122.1419), 13);
El ultimo parametro es el zoom. Puedes ver mas información sobre estas funciones en la Referencia del API de Google Maps.
Hasta aquí ya creamos un mapa básico, a continuación le agregaremos controles como el zoom y el tipo de vista, para ello modificamos el código anterior de manera que quede así...
if (GBrowserIsCompatible()) {
var map2 = new GMap2(document.getElementById("map2"));
map2.addControl(new GSmallMapControl());
map2.addControl(new GMapTypeControl());
map2.setCenter(new GLatLng(37.4419, -122.1419), 13);
}
Veamos las dos líneas nuevas de código que agregamos son map2.addControl(new GSmallMapControl()); que agrega la función de movernos y hacer zoom en el mapa y map2.addControl(new GMapTypeControl()); que agrega los distintos tipos de vista (satelital, híbrido, mapa)
Esto es solo una introducción a el API de Google Maps, las posibilidades que nos brinda son infinitas solo hay que investigar un poco la Referencia del API de Google Maps.
Autor: Mauro Rondinelli
http://www.elguruprogramador.com.ar/usuarios/perfil.asp?id=1
Usuarios que han visto este tema también han visto...
- Abrir dos márcos con un único cilck en JavaScript
- Abrir ventana sin bordes
- ¿Carga rápido tu página?
- Conversor pesetas - euros
- Personalizar iconos en los mapas de Google
- Versión imprimible de este documento
- Enviar por e-mail este documento
