Desarrollo en HTML5, CSS y Javascript de WebApps, incl. móviles FirefoxOS* (4.ª ed.)
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="content-type">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="shortcut icon" href="maps-icon_16.png" /> <!-- icono de la pestaña de titulo -->
<title>Geolocalización</title>
<link href="reset.css" rel="stylesheet" type="text/css">
<link href="fonts.css" rel="stylesheet" type="text/css">
<link href="estilos.css" rel="stylesheet" type="text/css">
<script src="zepto.min.js" type="text/javascript"></script>
<script src="touch.js" type="text/javascript"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<script src="gmaps.js" type="text/javascript"></script>
<script src="geoposit.js" type="text/javascript"></script>
</head>
<body>
<header>
<nav>
<ul class="menu">
<span class="titulomenu">Geolocalización</span>
<li>
<a class="bt-menu" href="#"><span class="icon-menu"></span>Menú</a>
<ul>
<li><a id="limpiar" href="#"><span class="icon-map"></span>Limpiar</a></li>
<li><a id="compactar" href="#"><span class="icon-shrink"></span>Compactar</a></li>
<li><a id="inicializa" href="#"><span class="icon-location"></span>Inicializar</a></li>
<li><a id="actualizar" href="Modulo10.html"><span class="icon-spinner11"></span>Recargar</a></li>
</ul>
</li>
</ul>
<div class="clearfix"></div>
</nav>
</header>
<div id="map"></div>
<footer class="piefijo">Aceptar compartir ubicación para ver el mapa.<br><br>
</footer>
</body>
<!-- Módulo 10. API de geolocalización HTML5. Proyecto final del curso basado en Google Maps
Ejercicio P2P obligatorio
Explicación de la tarea
Modificar la aplicación con geolocalización en Google Maps, Añadiendo un botón de “compactar” las rutas mostradas.
Al pulsar el boton se deben eliminar los puntos intermedios de la ruta.
La ruta se compactará volviendo a renderizar el mapa limpio y mostrando sobre él solo los puntos inicial y final,
junto con la ruta directa que los une.
Empaquetar como App FirefoxOS packaged o hosted la aplicación realizada.
Publicar dicha app en Google Drive para que se pueda instalar por terceros e incluir los URLs de los instaladores
en la entrega para que los evaluadores puedan comprobar que se instalan correctamente en el simulador de FirefoxOS.
Recomendación: Crear una variable nueva que guarde en todo momento el punto inicial de la ruta.
La variable se inicializará en el momento de cargar la aplicación y guardará el origen de la ruta para cuando haya que compactar.
Al pulsar "compactar" se renderizará el mapa limpio,
se pondrán los marcadores inicial (variable nueva) y final (“lat”, “long”) y se mostrará la ruta entre ellos.
Alojar el script como un recurso público en un servidor en la nube (Google Drive)
para que pueda accederse por cualquier usuario desde cualquier navegador.
José Antonio Arjona -->
</html>
<html>
<head>
<meta content="text/html; charset=utf-8" http-equiv="content-type">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<link rel="shortcut icon" href="maps-icon_16.png" /> <!-- icono de la pestaña de titulo -->
<title>Geolocalización</title>
<link href="reset.css" rel="stylesheet" type="text/css">
<link href="fonts.css" rel="stylesheet" type="text/css">
<link href="estilos.css" rel="stylesheet" type="text/css">
<script src="zepto.min.js" type="text/javascript"></script>
<script src="touch.js" type="text/javascript"></script>
<script src="https://maps.google.com/maps/api/js?sensor=true" type="text/javascript"></script>
<script src="gmaps.js" type="text/javascript"></script>
<script src="geoposit.js" type="text/javascript"></script>
</head>
<body>
<header>
<nav>
<ul class="menu">
<span class="titulomenu">Geolocalización</span>
<li>
<a class="bt-menu" href="#"><span class="icon-menu"></span>Menú</a>
<ul>
<li><a id="limpiar" href="#"><span class="icon-map"></span>Limpiar</a></li>
<li><a id="compactar" href="#"><span class="icon-shrink"></span>Compactar</a></li>
<li><a id="inicializa" href="#"><span class="icon-location"></span>Inicializar</a></li>
<li><a id="actualizar" href="Modulo10.html"><span class="icon-spinner11"></span>Recargar</a></li>
</ul>
</li>
</ul>
<div class="clearfix"></div>
</nav>
</header>
<div id="map"></div>
<footer class="piefijo">Aceptar compartir ubicación para ver el mapa.<br><br>
</footer>
</body>
<!-- Módulo 10. API de geolocalización HTML5. Proyecto final del curso basado en Google Maps
Ejercicio P2P obligatorio
Explicación de la tarea
Modificar la aplicación con geolocalización en Google Maps, Añadiendo un botón de “compactar” las rutas mostradas.
Al pulsar el boton se deben eliminar los puntos intermedios de la ruta.
La ruta se compactará volviendo a renderizar el mapa limpio y mostrando sobre él solo los puntos inicial y final,
junto con la ruta directa que los une.
Empaquetar como App FirefoxOS packaged o hosted la aplicación realizada.
Publicar dicha app en Google Drive para que se pueda instalar por terceros e incluir los URLs de los instaladores
en la entrega para que los evaluadores puedan comprobar que se instalan correctamente en el simulador de FirefoxOS.
Recomendación: Crear una variable nueva que guarde en todo momento el punto inicial de la ruta.
La variable se inicializará en el momento de cargar la aplicación y guardará el origen de la ruta para cuando haya que compactar.
Al pulsar "compactar" se renderizará el mapa limpio,
se pondrán los marcadores inicial (variable nueva) y final (“lat”, “long”) y se mostrará la ruta entre ellos.
Alojar el script como un recurso público en un servidor en la nube (Google Drive)
para que pueda accederse por cualquier usuario desde cualquier navegador.
José Antonio Arjona -->
</html>
Comentarios
Publicar un comentario