Yahoo! User Interface Blog (YUIBlog)

In der YUI 3 Galerie: Geo

6. Mai 2011 um 04.46 Uhr von Nicholas C. Zakas | In Entwicklung , YUI 3 Galerie | Keine Kommentare

Geolocation ist einer der aufregendsten HTML5-Technologien, um im Browser angezeigt, und die Geo Galerie-Modul ermöglicht Ihnen den Ort Zugriff auf Informationen. Das W3C Geolocation API bietet eine einfache Schnittstelle zum Standort des Benutzers aus JavaScript zugreifen. Der folgende Code greift der Benutzer die aktuelle Position in einer unterstützenden Browser:

navigator.geolocation.getCurrentPosition(function(result) { //success handler }, function (result){ //failure handler }) 

Wenn dieser Code ausgeführt wird, öffnet der Browser eine Meldung für den Benutzer um Erlaubnis, ihren aktuellen Standort zu offenbaren. Der Dialog in Firefox angezeigt wird, sieht wie folgt aus:

Wenn der Benutzer verweigert die Erlaubnis, oder ein Fehler auftritt beim Versuch, die aktuelle Position zu bekommen, ist das Scheitern Handler aufgerufen. Ansonsten ist der Erfolg Handler mit Informationen über den aktuellen Standort genannt. Diese Informationen gibt es in Form von Längen-und Breitengrad-Koordinaten (weitere Informationen verfügbar sein sowie, abhängig von der Implementierung).

Das W3C Geolocation API wird in Internet Explorer 9 +, Firefox 3.5 +, Safari 5 +, Chrome, Opera und 10,6 sowie auf Mobile Safari und Webkit auf Android unterstützt, so dass es ziemlich allgegenwärtig.

Das Geo-Modul nutzt die Geolocation API, wenn es verfügbar ist, und fällt zurück auf ein IP-basiertes lookup über die YQL pidgets.geoip offenen Tisch, wenn sie nicht verfügbar ist oder wenn es einen Fehler. Diese Tabelle ist besonders nützlich, weil Sie Standortinformationen für eine bestimmte IP-Adress-Suche kann, oder Sie können die IP-Adresse weglassen, und es wird die Lage für die IP-Adresse, der die Anfrage zurück. Der letzte Teil stellt sicher, dass Sie nur einen Antrag zu stellen braucht, um Standortinformationen statt zwei bekommen (andere Lösungen verwenden Sie eine der IP-Adresse bekommen und dann den Speicherort für die IP-Adresse zu erhalten).

In typischen YUI Mode bietet der Geo-Modul eine optimierte Benutzeroberfläche für den Zugriff auf Geolocation Informationen. Statt Bereitstellung von zwei Callback-Funktionen, eine für den Erfolg und eine für Versagen, nur in einem Durchgang. Das Ergebnis-Objekt hat eine success Eigenschaft, die angibt, ob der Aufruf erfolgreich:

 YUI({ gallery: 'gallery-2011.04.27-17-14' }).use('gallery-geo', function(Y) { Y.Geo.getCurrentLocation(function(response){ //check to see if it was successful if (response.success){ console.log(response.coords.latitude); console.log(response.coords.longitude); } }); }); 

Wenn ein Geolocation erfolgreich abgeschlossen wird, der success ist Eigentum wahr und response.coords ist mit mindestens zwei Eigenschaften erfüllt: latitude und longitude (wenn die native API verwendet wird, dann werden alle verfügbaren Eigenschaften sind auf dieses Objekt kopiert). Es gibt auch eine source -Eigenschaft auf dem Response-Objekt, das entweder "native" ist, wenn die Informationen aus dem nativen API, oder "pidgets.geoip" abgerufen wurde, wenn es von YQL abgerufen wurde. Wenn ein Fehler auftritt, oder wenn der Benutzer sinkt um Standortinformationen bereitzustellen, dann success , ist falsch.

Wenn die Geolocation API hat einen Fehler, wird das Geo-Modul IP-basierte lookup statt zu versuchen. Wenn jedoch lehnt es dem Benutzer, Informationen zu liefern, ist die IP-basierte lookup nicht durchgeführt.

Denken Sie daran, dass die native API wesentlich genauer als IP Lage ist, so dass Sie nicht die gleiche Qualität der Ergebnisse in Browsern ohne nativen Geolocation-Unterstützung. Allerdings ist das Geo-Modul ein guter erster Schritt, um die Bereitstellung location-based Erfahrungen für Ihre Benutzer.

Finden Gespräche: bloglines | technorati

Share and erweitern: Lesezeichen mit del.icio.us | digg it! | reddit!