Mikroformate und Karten

Jetzt ist es an der Zeit die Früchte der Arbeit zu ernten und eine Karte aufzurufen, zu der man seine eigenen Markierungspunkte hinzufügt. Google bietet ein API- und Beispiel-Dokument, das von Grund auf erklärt, wie man ein funktionales und ansehnliches Mashup erstellt. Anstatt diese Erklärung zu wiederholen folgt hier nur das, was für die vorliegende Aufgabe vonnöten ist.

Um eine Karte darstellen zu können, müssen das Google-Maps-API-Script und ein div-Element mit der ID „map“ eingebaut werden. Danach muss man die Ladefunktion so codieren, dass die API angewiesen wird, das Gewünschte darzustellen. Hier wurde versucht, dafür Sorge zutragen, dass die Benutzeroberfläche der von Google Maps so ähnlich wie möglich ist. Das bedeutet, dass die große Steuereinheit für die Karte (die Zoom-Pfeile links im Bild), die Einstellmöglichkeit für das Kartenformat (hier kann man zwischen Karte, Satellitenaufnahmen und einer Hybridansicht wählen) und die Übersichtsnavigation (die kleine Übersichtskarte unten rechts) beibehalten wurden. Dann muss der Karte mitgeteilt werden, was man betrachten möchte. Durch Herumprobieren ließen sich ein Längen- und ein Breitengrad und ein Zoomfaktor finden, die eine schöne, zentrierte Darstellung von Australien ins Bild bringen.

Jetzt müssen die zwischengespeicherten Ergebnisse aufgerufen und mit ihnen ein Javascript-Array erzeugt werden. Der Grund dafür, ein Array anzulegen, anstatt einfach Markierungen zu setzen, die auf den Ergebnissen basieren, wird gleich offensichtlich: Über das Javascript-Array werden die Markierungen mittels der zuvor definierten Funktion createMarker gesetzt. Diese Funktion verwendet drei Parameter: den Punkt, an dem die Markierung gesetzt werden soll, welche Nutzergruppen sich dort befinden und einen „when“ genannten Parameter, von dem in Zukunft hoffentlich noch weiterer Gebrauch gemacht werden kann. Derzeit legt er den Text auf die Markierung und verankert diese am vorgegebenen Punkt.

Inzwischen liegt eine funktionsfähige Karte vor, auf der sich die gewünschten Markierungen befinden. Die Navigation auf der Karte gestaltet sich aber noch schwierig, die Benutzeroberfläche bedarf noch weiterer Verbesserungen. Hier kommt die Liste mit den Orten am rechten Rand der Karte ins Spiel. Die panhandle-Funktion setzt den Zoomfaktor und schwenkt auf den vom Nutzer eingegebenen Bildausschnitt. Beim Durchsuchen von Google Maps konnten Längen- und Breitengrade der meisten Orte mit Nutzergruppen auf der Karte bestimmt werden. Glücklicherweise gibt es derzeit nur eine Handvoll von Orten, andernfalls hätte man dies dem Scraper hinzufügen müssen, was sich als zukünftige Verbesserung jedoch anbietet.

Die letzte auf dieser Seite zu definierende Methode heißt findme. Diese Methode wird mittels kleiner Symbole neben den Namen der Nutzergruppen in den Listings aufgerufen. Sie durchsucht das zuvor angelegte Javascript-Array nach dem Namen der Gruppe. Wenn die Gruppe gefunden wurde, verschiebt sich der Kartenausschnitt so, dass der Ort, an dem sie sich befindet, im Zentrum der Darstellung liegt.

Hier das vollständige Listing der Kartendatei: