Recomendados
Más contenido relacionado
Similar a Google Maps
Similar a Google Maps (20)
Más de jvelizster
Más de jvelizster (17)
Último
Último (20)
Google Maps
- 1. Desarrollo de aplicaciones web 2.0 Gonzalo García G.
- 2. Agenda ¿Qué es el Api de Google Maps?. Trabajando con el Api de Google Maps. Cargando el Api de Google Maps. Atributos del Mapa. Controles Básicos de un Mapa. Api de Google Maps Ejemplos.
- 3. ¿Qué es el Api de ? Es un servidor de aplicaciones de mapas en Web. Ofrece imágenes de mapas desplazables. Nos permite insertar mapas en nuestras páginas web. http://maps.google.com Servicio gratuito. Parecido a Google Earth. Posee diferentes servicios que pueden ser utilizados La ruta mas corta
- 4. Trabajando con el Api de Debemos disponer de un KEY. http://code.google.com/intl/es/apis/maps/signup.html Necesita tener una cuenta de GMAIL. micuenta@gmail.com La URL donde se aloja nuestro aplicativo http://127.0.0.1.8988/GoogleMapsApp ABQIAAAA6ztTU_R6Fg4G5z_F3u6ARhT_GVpaUHXll3jKIaNe6cKcjekxixRJnNqWj4iDOCWTAbCTaAEzTgEaYQ
- 5. <script src="http://maps.google.com/maps?file=api&v=2&sensor=true_or_false&key=ABQIAAAA6ztTU_R6Fg4G5z_F3u6ARhT2yXp_ZAY8_ufC3CFXhHIE1NvwkxSHhKsXphs70Fe97C9GoHnhLszwqg" type="text/javascript"> </script> Trabajando con el Api de
- 6. Cargando el Api de Incluimos el código JavaScript del API de Google Maps mediante la etiqueta <script> Creamos un elemento <div id=‘map_canvas’> que aloja el mapa. Escribimos una función JavaScript para crear un objeto de mapa initialize(). Centramos el mapa en un punto geográfico concreto. Inicializamos el objeto de mapa desde el evento onLoad de la etiqueta <body>.
- 7. Cargando el Api de <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Google Maps Desarrollo de Aplicaciones Web 2.0</title> <script src="http://maps.google.com/maps?file=api&v=2&sensor=false&key=ABQIAAAA6ztTU_R6Fg4G5z_F3u6ARhT_GVpaUHXll3jKIaNe6cKcjekxixRJnNqWj4iDOCWTAbCTaAEzTgEaYQ" type="text/javascript"> </script> <script type="text/javascript"> functioninitialize() { if (GBrowserIsCompatible()) { varmap = new GMap2(document.getElementById("map_canvas")); map.setCenter(new GLatLng(-2.204691, -79.889109), 15); } } </script> </head> <bodyonload="initialize()" onunload="GUnload()"> <div id="map_canvas" style="width: 500px; height: 300px"></div> </body> </html>
- 8. Cargando el Api de
- 9. Atributos del Mapa Definidos mediante el método setMapType de GMap2 G_NORMAL_MAP: la vista predeterminada. G_SATELLITE_MAP: imágenes de satélite de Google Earth. G_HYBRID_MAP: mezcla de vistas normales y de satélite. G_DEFAULT_MAP_TYPES: una mezcla de estos tres tipos, útil para un procesamiento repetitivo.
- 10. Controles Básicos de un Mapa GMapTypeControl Denota el tipo de Mapa: Híbrido, Satélite o Mapa GLargeMapControl Muestra un barra de desplazamiento para el zoom del mapa GScaleControl La escala del mapa GOverviewMapControl Muestra un mini-mapa en la esquina inferior derecha
- 11. Api de Referencia WEB. http://code.google.com/intl/es/apis/maps/documentation/reference.html
- 12. Ejemplos