Γεωγραφική Τοποθεσία του HTML5
- Προηγούμενη Σελίδα Μεταφορά του HTML5
- Επόμενη Σελίδα Drag and Drop του HTML5
Η HTML5 Geolocation χρησιμοποιείται για την τοποθέτηση του χρήστη.
Προσπαθήστε το προσωπικά: Εμφανίστε τη τοποθεσία σας στο Google Maps
Τοποθέτηση του χρήστη
Η API Geolocation του HTML5 χρησιμοποιείται για την απόκτηση της γεωγραφικής τοποθεσίας του χρήστη.
Επειδή η χαρακτηριστική αυτή μπορεί να παραβιάσει την ιδιωτικότητα του χρήστη, οι πληροφορίες τοποθεσίας του χρήστη δεν είναι διαθέσιμες χωρίς την συγκατάθεση του χρήστη.
Υποστήριξη περιηγητών
O Internet Explorer 9, Firefox, Chrome, Safari και Opera υποστηρίζουν τη γεωθέση.
Σημείωση:Για συσκευές με GPS, όπως το iPhone, η γεωθέση είναι πιο ακριβής.
HTML5 - Χρήση γεωθέσης
Χρησιμοποιήστε τη μέθοδο getCurrentPosition() για να αποκτήσετε τη τοποθεσία του χρήστη.
Το παρακάτω παράδειγμα είναι μια απλή περίπτωση γεωθέσης που μπορεί να επιστρέψει τις γεωγραφικές συντεταγμένες της τοποθεσίας του χρήστη.
Παράδειγμα
<script> var x=document.getElementById("demo"); function getLocation() { if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(showPosition); } else{x.innerHTML="Η Γεωθέση δεν υποστηρίζεται από αυτό το πρόγραμμα περιήγησης.";} } function showPosition(position) { x.innerHTML="Γεωγραφικό Πλάτος: " + position.coords.latitude + "<br />Γεωγραφικό Μήκος: " + position.coords.longitude; } </script>
Αιτολογία παράδειγμα:
- Έλεγχος αν υποστηρίζεται η γεωθέση
- Αν υποστηρίζεται, εκτελείται η μέθοδος getCurrentPosition(). Αν δεν υποστηρίζεται, εμφανίζεται ένα μήνυμα στον χρήστη.
- Αν ο getCurrentPosition() εκτελεστεί επιτυχώς, επιστρέφει έναν αντικείμενο coordinates στον ορισμένο παράγοντα της συνάρτησης showPosition
- Η συνάρτηση showPosition() αποκτά και εμφανίζει τις γεωγραφικές συντεταγμένες
Ο παραπάνω παράδειγμα είναι ένας πολύ βασικός σκοπός γεωθέσης χωρίς επεξεργασία σφαλμάτων.
Επεξεργασία σφαλμάτων και απορρήτου
Ο δεύτερος παράγοντας του μεθόδου getCurrentPosition() χρησιμοποιείται για την επεξεργασία σφαλμάτων. Εκτελεί τη συνάρτηση που θα εκτελεστεί όταν η απόκτηση της τοποθεσίας του χρήστη αποτύχει:
Παράδειγμα
function showError(error) { switch(error.code) { case error.PERMISSION_DENIED: x.innerHTML="Ο χρήστης απέρριψε την αίτηση γεωθέσης." break; case error.POSITION_UNAVAILABLE: x.innerHTML="Πληροφορίες τοποθεσίας δεν είναι διαθέσιμες." break; case error.TIMEOUT: x.innerHTML="The request to get user location timed out." break; case error.UNKNOWN_ERROR: x.innerHTML="An unknown error occurred." break; } }
Κώδικας σφάλματος:
- Permission denied - Ο χρήστης δεν επιτρέπεται η γεωτοποθέτηση
- Position unavailable - Δεν μπορεί να αποκτηθεί η τοποθεσία
- Timeout - Υπάρχει υπερβολή στον χρόνο εκτέλεσης της λειτουργίας
Εμφάνιση αποτελεσμάτων στον χάρτη
Για να εμφανίσετε τα αποτελέσματα στον χάρτη, πρέπει να επισκεφθείτε υπηρεσίες χαρτών που υποστηρίζουν γεωγραφικές συντεταγμένες, όπως το Google Maps ή το Baidu Maps:
Παράδειγμα
function showPosition(position) { var latlon=position.coords.latitude+","+position.coords.longitude; var img_url="http://maps.googleapis.com/maps/api/staticmap?center=" +latlon+"&zoom=14&size=400x300&sensor=false"; document.getElementById("mapholder").innerHTML="<img src='"+img_url+"' />"; }
Στο παρακάτω παράδειγμα, χρησιμοποιούμε τα δεδομένα γεωγραφικής διάστασης που επιστρέφονται για να εμφανίσουμε τη τοποθεσία στο Google Maps (χρησιμοποιώντας στατική εικόνα).
Το παρακάτω link δείχνει πώς να χρησιμοποιείτε script για να εμφανίζετε διαδραστικούς χάρτες με επιλογές σημειώσεων, κλίμακας και σύρραξης.
Πληροφορίες για την τοποθεσία
Η σελίδα αυτή δείχνει πώς να εμφανίζεται η τοποθεσία του χρήστη σε χάρτη. Ωστόσο, η γεωτοποθέτηση είναι πολύ χρήσιμη και για πληροφορίες σε συγκεκριμένες τοποθεσίες.
Παράδειγμα:
- Ενημέρωση τοπικών πληροφοριών
- Εμφάνιση σημείων ενδιαφέροντος γύρω από τον χρήστη
- Διαδραστικό σύστημα καθοδήγησης οχημάτων (GPS)
Μέθοδος getCurrentPosition() - Επιστροφή δεδομένων
Εάν επιτυχής, η μέθοδος getCurrentPosition() επιστρέφει αντικείμενο. Πάντα επιστρέφονται τα attributes latitude, longitude και accuracy. Αν είναι διαθέσιμα, επιστρέφονται και άλλα παρακάτω attributes.
Σημείωση | Περιγραφή |
---|---|
coords.latitude | Δεκαδικό πλάτος γεωγραφικής διάστασης |
coords.longitude | Δεκαδικό μήκος γεωγραφικής διάστασης |
coords.accuracy | Ακρίβεια τοποθεσίας |
coords.altitude | Ακρίβεια υψόμετρου, μετρημένη από το επίπεδο της θάλασσας σε μέτρα |
coords.altitudeAccuracy | Ακρίβεια υψομέτρου της θέσης |
coords.heading | Κοσμογραφική κατεύθυνση, μείον από τον Βορρά, με γωνίες |
coords.speed | Συχνότητα, μετρικά ανά δευτερόλεπτο |
timestamp | Απάντηση Ημερομηνίας/Χρόνου |
Γεωθεση Αντικείμενο - Άλλες ενδιαφέρουσες μεθόδους
watchPosition() - Επιστροφή της τρέχουσας θέσης του χρήστη και συνεχής επιστροφή των ενημερώσεων θέσης του χρήστη κατά τη διάρκεια της κίνησης (όπως το GPS ενός αυτοκινήτου).
clearWatch() - Απόσυρση της μεθόδου watchPosition()
Το παρακάτω παράδειγμα παρουσιάζει τη μέθοδο watchPosition(). Πρέπει να έχετε ένα ακριβές GPS δίτημα για να δοκιμάσετε αυτό το παράδειγμα (π.χ. iPhone):
Παράδειγμα
<script> var x=document.getElementById("demo"); function getLocation() { if (navigator.geolocation) { navigator.geolocation.watchPosition(showPosition); } else{x.innerHTML="Η Γεωθέση δεν υποστηρίζεται από αυτό το πρόγραμμα περιήγησης.";} } function showPosition(position) { x.innerHTML="Γεωγραφικό Πλάτος: " + position.coords.latitude + "<br />Γεωγραφικό Μήκος: " + position.coords.longitude; } </script>
- Προηγούμενη Σελίδα Μεταφορά του HTML5
- Επόμενη Σελίδα Drag and Drop του HTML5