15.07.2014
10:20 Uhr

Interaktive Google Maps-Karten am Beispiel der neuen Webseite der
Airport Region Berlin Brandenburg

von Sara Copray, Christoph Franz | Blog, Kunden
Interaktive Google Maps-Karten am Beispiel der neuen Webseite der <br />Airport Region Berlin Brandenburg

Das Team der Airport Region Berlin Brandenburg (ART) vermarktet das wirtschaftliche Umfeld des zukünftigen Flughafens Berlin Brandenburg BER. Zentrale Instrumente, die das ART zur Ansprache ihrer Zielgruppen nutzt, sind die Website und ein Medientisch, der bei der direkten Ansprache auf Messen und Veranstaltungen zum Einsatz kommt.

Ziel für uns war, für den Webauftritt, den Medientisch, Tablets und Smartphones ein modernes und intuitiv bedienbares Interface zu entwickeln, welches auf verschiedenen Endgeräten zum Einsatz kommen kann. 

Eine Besonderheit der Webseite bieten die interaktiven Google Maps-Karten, auf die wir in diesem Blog-Eintrag beispielhaft eingehen wollen.

Anpassen von individuellen Google Maps-Karten 

Google Maps erlaubt seinen Nutzern, mit Hilfe seines „Styled Maps Wizards“ sowie ein paar Konfigurationseinstellungen, die eigenen Google Maps-Karte in Gestaltung und Funktion komplett zu individualisieren und seinen Bedürfnissen anzupassen.

So gibt es zum Beispiel folgende Möglichkeiten:

  • Entfernen aller nicht benötigten Navigationselemente wie Zoom-Stufen oder Richtungsweiser
  • Individuelles Einfärben der Landschaft und Oberflächen bis ins kleinste Detail (Straßen, Zufahrtswege, spezielle Orte)
  • Ein- und Ausblenden nicht benötigter Infrastruktur 
  • Hervorheben eines bestimmten Kartenausschnitts

Google selbst liefert dafür dem Entwickler ein JSON-Code-Snippet zurück, welches man anschließend innerhalb seiner Entwicklung verwenden kann.

Damit die zukünftigen Google Maps-Karten der Airport Region Berlin Brandenburg genau auf die Bedürfnisse der Nutzer zugeschnitten sind, haben wir mehrere Prototypen der Karten erstellt, in denen wir die Möglichkeiten der Schnittstelle von Google Maps testen konnten. 

Wichtig war hierbei,  dass neben der Standard-Desktop Variante sowohl Tablets, Smartphones als auch der interaktive Medientisch bedient werden konnten.

Nachdem alle Tests abgeschlossen waren und der Prototyp unseren Erwartungen entsprach, ging es in die finale Umsetzung der Karten. 

Mit Hilfe der Google Maps JavaScript API Karten bis ins Detail individualisieren

Die Google Maps JavaScript API lässt das inhaltliche Individualisieren der Google Maps-Karten zu. Es ermöglicht zum Beispiel: 

  • das Hinzufügen eigener gestalteter Marker für Koordinaten
  • das Verbinden von Orten über eine bestimmte Distanz 
  • eigene Zoom- und Navigationshilfen
  • individuelle Ansichten für verschiedene Zoomstufen (je dichter, desto Detailreicher)
  • interaktive Filter zum Sichtbarschalten bestimmter Bereiche
  • farbliche Overlays, mit denen bestimmte Regionen visuell abgesetzt werden können
  • klickbare Bereiche zum Nachladen dynamischer Inhalte per AJAX

Die Nutzer der Website der Airport Region Berlin Brandenburg können nun mit wenigen Klicks die Karten ihren eigenen Interessen anpassen.  

Wir haben auf der Webseite der Airport Region Berlin Brandenburg Karten zu den Gewerbestandorten in Berlin und Gewerbestandorten im direkten Flughafenumfeld und eine Infrastrukturkarte erstellt. Außerdem können Sie sich die Flugentfernungen innerhalb Europas und der Welt genauer anschauen.


Kommentare zu diesem Blogeintrag: