Karten-Quiz

RichieCarmichael

<\/HEAD>

<\/A>

Map Quiz ist ein unterhaltsames, JavaScript-basiertes Geo-Spiel, entwickelt vom Applications Prototype Lab. Das Spiel testet dein geografisches Wissen mit sechs zufällig ausgewählten Satellitenbildern. Beweise, dass du ein Geo-Genie zu Hause, in der Schule oder am Arbeitsplatz bist!

Klicke hier<\/A>, um auf die Live-Anwendung zuzugreifen.

Klicke hier<\/A>, um den Quellcode herunterzuladen.<\/P>

Einführung<\/H2>
Dieses Projekt ist eine Portierung einer Anwendung, die ursprünglich als Windows Store-Anwendung entwickelt wurde.  Zweck der Anwendung ist es, ein unterhaltsames, geografieorientiertes Spiel (oder "Geo-Spiel") basierend auf Esri<\/A>-Technologie zu präsentieren.  Die Anwendung basiert hauptsächlich auf Esris ArcGIS API for JavaScript<\/A> und wird von ArcGIS Online<\/A> (AGOL) gehosteten Diensten für Punktevergabe und Fragen unterstützt.  Ursprünglich nutzte die Windows Store-basierte Anwendung AGOL-basierte Authentifizierung, in der JavaScript-Version haben wir uns entschieden, Facebook-Authentifizierung zu verwenden, um ein breiteres Publikum anzusprechen.<\/P>

Warum Facebook?<\/H2>
Eine der Motivationen beim Spielen ist der Nervenkitzel des Wettbewerbs, sei es persönlich oder mit anderen.  Um Benutzer zu identifizieren, damit sie ihre Punktzahlen oder die anderer überwachen können, musste eine Art Authentifizierung erfolgen.  Die offensichtliche Wahl ist AGOL.  AGOL ist die perfekte Wahl, wenn Zusammenarbeit innerhalb der GIS-Community erforderlich ist, aber ein großer Teil der Zielgruppe dieser Anwendung möglicherweise keine AGOL-Zugangsdaten hat. Man könnte argumentieren, dass Facebook nicht vollständig allgegenwärtig ist, aber sicherlich verbreitet.  Daher haben wir uns entschieden, Facebook und die Facebook API zur Authentifizierung der Benutzer zu verwenden.  Um Datenschutzbedenken zu mildern, fordert diese Anwendung nur eine kleine Teilmenge von Profilinformationen an und zeigt diese an, nämlich das Profilbild einer Person, den Nachnamen und den Anfangsbuchstaben des Vornamens.<\/P>Zugriffskontrolle auf gehostete Dienste<\/H2>
Die Fragen, Antworten und Punktzahlen des Spiels werden in zwei ArcGIS Online gehosteten Feature-Diensten gespeichert.  Gehostete Dienste sind einfach zu erstellen und ermöglichen leistungsstarke räumliche Abfragen.  Der Zugriff auf gehostete Dienste ist jedoch entweder uneingeschränkt oder auf eine Organisation bzw. auf Benutzer beschränkt, die bestimmten Gruppen angehören.  Da dieses Spiel für Nicht-AGOL-Benutzer gedacht ist, benötigten wir eine Möglichkeit, den Zugriff auf die gehosteten Dienste ausschließlich auf die Map Quiz<\/EM>-Webanwendung zu beschränken.

Dies wurde erreicht durch Registrierung der App<\/A> bei AGOL.  Die daraus resultierende App-ID und das Secret wurden dann in einem Webproxy verwendet, der exklusiven Zugriff auf die gehosteten Dienste nur für die Map Quiz-Webanwendung gewährte.  Der Proxy und Anweisungen zur Implementierung sind hier<\/A>.<\/P>

Drehung<\/H2>
Die drehende Karte auf der Startseite oder das allmähliche Hereinzoomen jeder Frage wird mit CSS3-Animation und der animo JavaScript-Bibliothek (siehe oben) erreicht.  In modernen Browsern sind die Animationseffekte flüssig und konsistent.  Bezüglich der drehenden Karte mussten die Kartenränder nach außen erweitert werden, um weiße Flecken in den Ecken zu vermeiden.  Um dies zu vermeiden, haben wir negative Ränder mit einer pythagoreischen Berechnung angewendet.  Ein Nachteil der drehenden Karte ist, dass gelegentlich Bildnähte sichtbar sind.<\/P>Silverlight vs. JavaScript<\/H2>
Als ehemaliger Silverlight-Entwickler war ich angenehm überrascht von der Leistung und den Fähigkeiten von JavaScript-basierten Webanwendungen.  Bis heute bin ich noch keiner Silverlight-Funktion begegnet, die nicht mit HTML5\/_CSS3 erreicht werden konnte.  Das größte Problem war der Paradigmenwechsel vom großen gut dokumentierten Silverlight-Framework hin zur Notwendigkeit, mit einem halben Dutzend leicht dokumentierter Open-Source-Bibliotheken zu arbeiten.<\/P>Verwendete Bibliotheken<\/H2>
Wie oben erwähnt basiert dieses Projekt auf einigen Open-Source-Bibliotheken, diese Bibliotheken sind unten aufgeführt und beschrieben.<\/P>animo.js<\/A> von Daniel Raftery<\/A>Dies ist eine kleine aber leistungsstarke Bibliothek zur programmatischen Erstellung und Verwaltung von CSS-Animationen.<\/EM><\/LI><\/UL><\/DIV><\/P>ArcGIS API for JavaScript<\/A> von <A href="http:\/\/www.esri.com\/

Nore8429

Hello, I'm trying to use the app but the button to log in doesn't appear. Can any one tell what it's wrong please.

Thank you.