3D Area Explorer – Erste Schritte

Image

Überblick

Mit dem 3D Area Explorer können Sie Orte auf ganz neue Weise entdecken. Diese Lösung nutzt die Funktionen von fotorealistischen 3D-Kacheln der Google Maps Platform und der Places API, um fesselnde, interaktive 3D-Umgebungen zu erstellen.

Der 3D Area Explorer soll mehreren Zwecken dienen:

  • Bessere Erkundung von Gebieten:Nutzer können Viertel virtuell mit hohen visuellen Details erkunden und so einen Einblick in lokale Besonderheiten und Sehenswürdigkeiten erhalten.

  • Standortbasierte Darstellungen fördern: Die Möglichkeit, POIs (Points of Interest) in ausführliche Beschreibungen zu integrieren, ermöglicht die Erstellung narrativer Inhalte, die Nutzer über bestimmte Orte informieren und informieren.

  • Inspirierende Entwicklung mit den 3D-Funktionen von Google Maps:Das Tool demonstriert das Potenzial der 3D-Kartendaten von Google für die Erstellung immersiver, interaktiver Karten.

Erste Schritte:

Aktivieren

Schlüsseltechnologien

Diese Lösung basiert auf zwei Schlüsseltechnologien:

Google Maps Platform-APIs:

Wir verwenden mehrere APIs der Google Maps Platform, um die Basiskarte und die entsprechenden Daten zu erhalten:

  • Fotorealistische 3D-Kacheln in Google Maps: Hochauflösende 3D-Modelle von Gebäuden und Geländen bieten eine realistische und visuell ansprechende Darstellung städtischer Umgebungen.
  • Places API: Die App kann detaillierte Informationen zu POIs (Points of Interest) innerhalb des erforschten Bereichs identifizieren und anzeigen lassen, wodurch Nutzer ihr Wissen erweitern können.
  • Mit der automatischen Vervollständigung können Nutzer nach bestimmten Orten oder interessanten Orten suchen.

CesiumJS

CesiumJS ist für das Rendern und Anzeigen des hochauflösenden 3D-Globus verantwortlich. Er übernimmt das Laden und die Visualisierung der fotorealistischen 3D-Kacheln von Google, die ein 3D-Mesh-Modell von Gebäuden und Geländen liefern.

Kameraverwaltung:CesiumJS stellt die Tools zum Steuern der Position, Ausrichtung und Bewegung der Kamera bereit. Dazu zählen:

  • Festlegen des anfänglichen Blickwinkels auf das angegebene Viertel beim Laden der App
  • Dynamische Kamerabewegungen implementieren, z. B. automatisierte Orbitanimationen für die Erkundung.
  • Umgang von Nutzerinteraktionen mit dem Globus, wenn solche Elemente enthalten sind (Schwenken, Zoomen, Drehen).

Informationen zu fotorealistischen 3D-Kacheln mit einem Renderer für 3D-Kacheln

Hauptkomponenten

Die App ist in zwei verschiedene Apps unterteilt:

  • Admin-App
  • Demo-App

Dieses Diagramm gibt einen Überblick über die Unterschiede und die Korrelation zwischen den beiden Anwendungen:

Image

Sie sollten jede App genauer untersuchen:

Admin-App

Diese Anwendung bietet eine nutzerfreundliche Oberfläche, mit der Sie die 3D-Ansicht anpassen können:

  • Standortsuche :Über die integrierte Suchleiste der Google Maps Platform mit automatischer Vervollständigung finden Sie den Bereich, den Sie präsentieren möchten. Sobald Sie einen Ort ausgewählt haben, fliegt die Kamera nahtlos in diesen Bereich.

  • Kamera:Passen Sie die Bewegungsgeschwindigkeit der Kamera und den Orbittyp an, um das jeweils gewünschte Videoformat zu erstellen.

  • Orte (POIs): Legen Sie die Dichte, den Suchradius und die Arten von POIs (z.B. Restaurants, Cafés, Sehenswürdigkeiten) fest, die Sie zeigen möchten.

Verwenden Sie diese App, um die Erfahrung für Ihre Endnutzer anzupassen.

Es gibt eine detaillierte Beschreibung aller Anpassungen im 3D Area Explorer.

Demo-App

Dies ist die endgültige, an Nutzer gerichtete Anwendung, mit der die Konfiguration geladen wird, die Sie in der Admin-App erstellt haben. In dieser immersiven 3D-Umgebung können Nutzer die ausgewählten Bereiche und die von Ihnen markierten Orte entdecken.

Nachdem Sie das Design mit der Admin-Anwendung angepasst haben, können Sie die Konfiguration herunterladen und Ihre benutzerdefinierte Anwendung aus dem Quellcode ausführen.

Benutzerfreundlichkeit

Image

Einige der wichtigsten Funktionen der Anwendung sind:

  1. Nutzer können ein Gebiet einschließlich Gebäuden, Sehenswürdigkeiten und Gelände interaktiv in 3D erkunden.
  2. Nutzer können Orte in der Nähe suchen und entdecken (z.B. Museen, Parks, Restaurants).
  3. Wenn Nutzer einen Ort auswählen, können sie sich detaillierte Informationen oder Narrative zu diesem Ort ansehen.

  4. Entwickler können die explorative Datenanalyse mithilfe der Einstellungen und Steuerelemente personalisieren (in der Admin-App).

  5. Die automatische Drehung ist aktiviert. So kann sich die Kamera automatisch um den Mittelpunkt des ausgewählten Bereichs drehen.

Voraussetzungen

  1. Google Maps API-Schlüssel: Sie benötigen einen gültigen API-Schlüssel mit den folgenden APIs:

  2. Webserver: Sie können die Anwendung auf folgende Arten bereitstellen:

    • Ein lokaler Webserver (z.B. mit Node.js, HTTP-Server)
    • Statischer Webhosting-Dienst (die Anwendung wird mit einem Dockerfile geliefert)

Eine detaillierte Beschreibung der Bereitstellungsoptionen finden Sie im Readme-Abschnitt des GitHub-Projekts.

Bereitstellung

Sie können die Anwendung als Knotenanwendung oder als Docker-Container in einer beliebigen Containerumgebung wie GKE oder GAE bereitstellen. Die gehostete Demo verwendet die folgende Architektur:

Image

  • In dieser Architektur befindet sich der Code in einem GitHub-Projekt.
  • Cloud Build erfasst den Code bei jedem Push-to-Main und löst einen Build-Vorgang aus.
  • Im Rahmen des Builds wird der API-Schlüssel eingeschleust und ein Image erstellt, das dann in der Artifact Registry gespeichert wird.
  • Zum Schluss wird das neueste stabile Image aus Artifact Registry in Cloud Run bereitgestellt.
  • Außerdem führen wir einige Systemdiagnosen und Monitoring durch, um den Status der bereitgestellten Anwendungen zu prüfen.

Zahlungsinformationen

Bei der 3D Area Explorer-Lösung werden die Dienste der Google Maps Platform verwendet, um ein immersives, dynamisches Erlebnis zu bieten. Für einige APIs können Gebühren anfallen. Hier ein Überblick über die APIs und Links zu den Preisen.

Google Maps Platform – 3D Tiles API:

Die Storytelling-Lösung nutzt die 3D Tiles API, um die visuelle Darstellung mit Geodaten zu verbessern. Preisinformationen für die 3D Tiles API finden Sie unter Preise für die 3D Tiles API.

Google Maps Platform – Places API:

Die Places API wird für standortbasierte Daten eingesetzt, wodurch das Storytelling um umfassende Informationen ergänzt wird. Informationen zu den Kosten für die Google Places API finden Sie unter Google Maps Platform – Preise für die Places API.

Google Maps Platform – Autocomplete API:

Die automatische Vervollständigung verbessert die Nutzerinteraktion. Preisinformationen zu der Google Maps Autocomplete API finden Sie unter Google Maps Platform – Preise für die automatische Vervollständigung (Places Autocomplete).

CesiumJS:

Für die 3D-Globus-Visualisierung wird CesiumJS verwendet. CesiumJS ist zwar eine Open-Source-Software, doch zusätzliche Funktionen oder Dienste können mit Kosten verbunden sein. Premium-Angebote finden Sie in der CesiumJS-Dokumentation.

Es ist wichtig, die Preisdetails für die jeweilige API zu prüfen, da die Gebühren individuell anhand der Nutzung berechnet werden. Hinweis: Die Google Maps Platform bietet eine kostenlose Stufe mit einem gewissen kostenlosen Nutzungsumfang an. Die Preisangaben können je nach Anzahl der Anfragen und Nutzungsregion variieren.

Die genauesten und neuesten Informationen zu den Nutzungskosten für die Google Maps Platform und CesiumJS finden Sie immer auf den offiziellen Preisseiten. Achten Sie auf die Einhaltung der Nutzungsbedingungen dieser Dienste, um damit verbundene Ausgaben effektiv zu verwalten und zu verstehen.

Fazit

Dieses Dokument bietet einen Überblick über die Funktionen, Komponenten, Nutzererfahrung und technischen Anforderungen des 3D Area Explorer.

Mithilfe der fotorealistischen 3D-Kacheln von Google und der Places API können Sie Viertel virtuell erkunden, POIs entdecken und mehr über die Lokalgeschichte erfahren.

Egal, ob Sie ein Gebiet präsentieren, die Erkundung verbessern oder digitales Storytelling fördern möchten – der 3D Area Explorer bietet eine visuell beeindruckende Plattform.

Probieren Sie die Demo aus und passen Sie sie mithilfe der Admin-App an, um eine ansprechende und informative 3D-Ansicht zu erstellen.