3. Geolocalizacion
• Permite a los usuarios compartir su ubicación
• Muestra la posición de un usuario en el mapa
• Util para Tagging de contenido (fotos/videos)
• Navegación Turn-by-turn
• Alertar de puntos de interés
• Social networking
6. Informacion de localizacion
La informacion de localizacion consiste
en coordendas de latitud y longitud, e
informacion de presicion
7. Informacion de localizacion
• Dependiendo del dispositivo, metadata
adicional puede ser provista:
• Altitud
• Velocidad
• Si no hay informacion adicional se recibe
a null
8. Fuentes de informacion de localizacion
• Un dispositivo puede usar alguna de las
siguientes fuentes:
• IP Address
• Coordinate triangulation
• Global Positioning System (GPS)
• Wi-Fi with MAC addresses from RFID, Wi-Fi, and
Bluetooth
• GSM or CDMA cell phone IDs
• User defined
11. JavaScript
//Checking for browser support:
if(navigator.geolocation) {
document.getElementById("support").innerHTML =
"HTML5 Geolocation is supported.";
} else {
document.getElementById("support").innerHTML =
"HTML5 Geolocation is not supported.";
}
12. Tipos
• Hay dos tipos:
1. Por unica vez
(getCurrentPosition)
2. Actualizacion de la posicion
(watchPosition)
13. JavaScript
//One shot request
void getCurrentPosition(
in PositionCallback successCallback,
in optional PositionErrorCallback errorCallback,
in optional PositionOptions options);
//Access user’s position
navigator.geolocation.getCurrentPosition(
updateLocation, handleLocationError);
14. JavaScript
//Update the UI
function updateLocation(position) {
var latitude = position.coords.latitude;
var longitude = position.coords.longitude;
var accuracy = position.coords.accuracy;
document.getElementById("latitude").innerHTML =
latitude;
document.getElementById("longitude").innerHTML =
longitude;
document.getElementById(“accuracy”).innerHTML =
“This location is accurate within “ +
accuracy + “ meters.”
}
17. Integración de con Google Maps
• Las coordenadas no son fáciles de descifrar sin
verlas en un mapa
• Google Maps tiene soporte para HTML5
Geolocation
18. JavaScript
//Show coordinates on a Google Map
// Create a Google Map
//See Google API for more detail
var map = new
google.maps.Map2(document.getElementById("map"));
function updateLocation(position) {
//pass the position to the Google Map and center it
map.setCenter(new google.maps.LatLng(
position.coords.latitude,
position.coords.longitude,
13); // zoom level
}
navigator.geolocation.getCurrentPosition(
updateLocation, handleLocationError);
19. Browser Support
• Firefox 3.5
• Safari 5.0
• Chrome 5.0
• Opera 10.6
• IE 9+
The following steps are shown in the diagram: A user navigates to a location-aware application in the browser.The application web page loads and requests coordinates from the browser by making a Geolocation function call. The browser intercepts this and requests user permission. Let's assume that the permission is granted.The browser retrieves coordinate information from the device it is running on. For example, the IP address, Wi-Fi, or GPS coordinates. This is an internal function of the browser.The browser sends these coordinates to a trusted external location service, which returns a detailed location that can now be sent back to the host of the HTML5 Geolocation application.
The successCallback function parameter tells the browser which function you want called when the location data is made available. This is important because operations such as fetching location data may take a long time to complete. No user wants the browser to be locked up while the location is retrieved, and no developer wants his program to pause indefinitely—especially because fetching the location data will often be waiting on a user to grant permission. The successCallback is where you will receive the actual location information and act on it.However, as in most programming scenarios, it is good to plan for failure cases. It is quite possible that the request for location information may not complete for reasons beyond your control, and for those cases you will want to provide an errorCallback function that can present the user with an explanation, or perhaps make an attempt to try again. While optional, it is recommended that you provide one.Finally, an options object can be provided to the HTML5 Geolocation service to fine-tune the way it gathers data. This is an optional parameter that we will examine later.
