Mit Geospatial Creator und der Places API der Google Maps Platform entwickeln

1. Hinweis

Mit Geospatial Creator in Unity, basierend auf ARCore und fotorealistischen 3D-Kacheln der Google Maps Platform, können Sie schnell Augmented Reality-Anwendungen (AR) für einen bestimmten Breiten- und Längengrad erstellen und visualisieren – alles im Unity-Editor. Das kann die Zeit, die zum Erstellen einer einzelnen geolokalen AR-Szene für Ihre App benötigt wird, erheblich verkürzen. Was aber, wenn Sie mehrere ähnliche Erlebnisse an verschiedenen Standorten erstellen möchten? Mit der C#-API in Geospatial Creator ist das auch möglich.

In diesem Codelab schreiben Sie C#-Code, der Geospatial Creator und die Places API der Google Maps Platform verwendet, um mehrere raumbezogene Erlebnisse auf Grundlage einer anfänglichen Vorlage zu erstellen. Die resultierenden Erlebnisse können im Unity-Editor untersucht und optimiert werden, bevor sie in eine App kompiliert werden.

Das Buch hat die richtige Höhe.

Vorbereitung

Lerninhalte

  • So verwenden Sie APIs in Geospatial Creator, um ein geolokalisierte Erlebnis an mehreren Standorten zu erstellen und zu visualisieren.
  • So verwenden Sie die Places API der Google Maps Platform, um die Standorte von Orten zu finden.
  • So führen Sie die AR-Funktion auf Ihrem Gerät aus.

Voraussetzungen

2. Umgebung einrichten

Wenn Sie Geospatial Creator verwenden möchten, müssen Sie die Autorisierung für den Zugriff auf fotorealistische 3D-Kacheln, ARCore-Dienste in Google Cloud und die Places API der Google Maps Platform einrichten.

Google Cloud-Projekt einrichten

Für dieses Codelab ist ein Google Cloud-Projekt mit aktivierter Abrechnung erforderlich, um auf die Server-APIs von Google zugreifen zu können. Für dieses Codelab muss die Abrechnung eingerichtet werden. Es fallen aber nur Kosten an, wenn ein Projekt das Kontingent an kostenlosen Diensten überschreitet.

So richten Sie ein Projekt in Google Cloud ein:

  1. Erstellen Sie ein Projekt in der Google Cloud Console.Google Cloud-Projekt erstellen
  2. Geben Sie im Textfeld Project name (Projektname) einen geeigneten Namen ein, z. B. ARCore Geospatial Project, und wählen Sie einen beliebigen Speicherort aus.
  3. Klicken Sie auf Erstellen.
  4. Klicken Sie in der Google Cloud Console auf der Seite für die Projektauswahl auf Projekt erstellen.
  5. Weitere Informationen finden Sie unter Abrechnung aktivieren sowie unter Preise für fotorealistische 3D-Kacheln und Preise für die Places API (New).

Map Tiles API aktivieren

Die Map Tiles API stellt die fotorealistischen 3D-Kacheln bereit, die im Unity-Editor sichtbar sind.

  • Klicken Sie zum Aktivieren der Map Tiles API auf die folgende Schaltfläche und wählen Sie dann Aktivieren aus:

ARCore API aktivieren

Mit der ARCore API in Google Cloud können Sie auf dem Zielgerät auf die ARCore Geospatial API zugreifen.

  • Klicken Sie auf die folgende Schaltfläche und wählen Sie dann Aktivieren aus, um die ARCore API zu aktivieren:

Places API aktivieren

Mit der Places API von Google Maps Platform können Sie Standortdaten für über 200 Millionen Orte abrufen, die Sie im Codelab verwenden, um ähnliche Orte zu finden. Diese API liefert Suchergebnisse und geografische Koordinaten für Orte.

  • Klicken Sie zum Aktivieren der Places API auf die folgende Schaltfläche und wählen Sie dann Aktivieren aus:

API-Schlüssel für Ihr Projekt erstellen

So authentifizieren Sie Ihre App mit API-Schlüsselauthentifizierung bei den Remote-Google Cloud-Diensten:

  1. Wählen Sie in der Google Cloud Console unter APIs & Dienste die Option Anmeldedaten aus.
  2. Klicken Sie oben auf der Seite auf Anmeldedaten erstellen und wählen Sie dann API-Schlüssel aus.
  3. Notieren Sie sich den Schlüssel, da Sie ihn für die nächsten Schritte benötigen.

Software einrichten

So legen Sie los:

  1. Klonen Sie dieses Repository.
  2. Laden Sie Unity Hub herunter und installieren Sie damit Unity 2022.3. Achten Sie darauf, dass Sie entweder die optionalen Build-Tools für Android oder für iOS installieren.
  3. Klicken Sie in Unity Hub auf Add > Add project from disk (Hinzufügen > Projekt von der Festplatte hinzufügen).
  4. Wählen Sie im Bereich Hierarchie die Option AR Geospatial Creator Origin aus.
  5. Fügen Sie den API-Schlüssel in das Textfeld Google Maps Tile API Key ein und drücken Sie dann die Eingabetaste Enter (oder return unter macOS).API-Schlüssel in Geospatial Creator Origin einfügen
  6. Verwenden Sie unter Bearbeiten > Projekteinstellungen > XR-Plug-in-Verwaltung > ARCore-Erweiterungen die API-Schlüsselauthentifizierung für Android oder iOS und fügen Sie den API-Schlüssel ein.
  7. Wechseln Sie unter File > Build Settings (Datei > Build-Einstellungen) die Zielplattform zu Android oder iOS.

3. Ersten Anker erstellen

In diesem Codelab erstellen Sie einen AR-Anker, der an mehreren Orten verwendet werden kann. Sie verwenden öffentliche Bibliotheken in San Francisco, Kalifornien, als Beispiel, können aber auch Orte in Ihrer Nähe verwenden.

Komponente „Origin“ in Geospatial Creator

Für jede Unity-Szene, die mit Geospatial Creator erstellt wurde, ist genau ein Geospatial Creator-Ursprung erforderlich. Dieses Spielobjekt ist der Referenzpunkt für die Umwandlung von Breiten-, Längen- und Höhenwerten aus der realen Welt in Unity-Spielkoordinaten.

Das Beispielprojekt enthält einen Geospatial Creator-Ursprung, mit dem fotorealistische 3D-Kacheln im Scene-Editor gerendert werden. So können Sie genau sehen, wo auf der Welt Ihre AR-Inhalte angezeigt werden.

Ursprung verschieben

Verschieben Sie den Ursprung von Geospatial Creator zum Breiten- und Längengrad der Hauptbibliothek von San Francisco.

So nutzen Sie die integrierte Funktion von Geospatial Creator für die Places API, um den Ursprung automatisch an den richtigen Ort zu verlegen:

  1. Wählen Sie im Bereich Hierarchie das Spielobjekt Geospatial Creator Origin aus.
  2. Klicken Sie im Bereich Inspector auf Nach Standort suchen.
  3. Geben Sie im Suchdialogfeld San Francisco Public Library ein. Das erste Ergebnis sollte 100 Larkin Street sein.
  4. Klicken Sie auf Auf Objekte anwenden, um das Suchergebnis auf den Ursprung anzuwenden. Der Breiten- und Längengrad des Ursprungs sollte auf die neuen Koordinaten aktualisiert werden.

Das Gebäude ist zu sehen

Geospatial Creator-Anker in die Szene einfügen

Nachdem Sie einen Ursprung erstellt haben, fügen Sie einen Geospatial Creator-Anker über GameObject > XR > AR Geospatial Creator Anchor hinzu. Standardmäßig befindet sich der Anker an derselben Position wie der Ursprung.

Mit diesem Anker können Sie unsere 3D-AR-Inhalte positionieren. Ein 3D-Modell eines Buchs ist im Beispielprojekt enthalten.

So platzieren Sie das Buch in Ihrer Szene:

  1. Ziehen Sie im Bereich Projekt das Modell Buch in den Bereich Editor.
  2. Prüfen Sie im Bereich Hierarchie, ob das Buch ein untergeordnetes Element des Ankers ist, den Sie zuvor erstellt haben. Alle untergeordneten Spielobjekte des Geospatial Creator-Ankers werden relativ zum Anker positioniert.
  3. Wählen Sie im Bereich Hierarchie das Buch aus. Legen Sie die Positionswerte auf 0, 0, 0 fest.

Das Buch wird der Szene hinzugefügt.

Wenn Sie sich dieses Modell in der Editoransicht ansehen, wird deutlich, dass etwas nicht stimmt: Die Standardhöhe des Ankers liegt unter der Dachfläche der Bibliothek, während er hoch darüber schweben sollte.

Sie könnten das Objekt im Editor verschieben, um die ungefähre WGS84-Höhe zu ermitteln. Es ist jedoch besser, in dieser Situation Geospatial-Anker als Dachanker zu konfigurieren, damit ihre Höhe automatisch relativ zum Dach des Gebäudes, über dem sie sich befinden, korrigiert wird.

  • Öffnen Sie dazu den Bereich „Inspektor“ des Ankers und legen Sie die Altitude Type-Eigenschaft auf Rooftop fest.

Der Bereich „Inspector“

Beachten Sie, dass sich die Höhe des Ankers in der Editoransicht nicht ändert. Das liegt daran, dass die Höhe des Ankers zur Laufzeit bestimmt wird, wenn der Anker für Dach- und Geländeanker aufgelöst wird. Wenn Sie den Anker auf dem Dach in der Scene-Ansicht visualisieren möchten, können Sie die Schaltfläche An Kachel ausrichten verwenden. Dadurch wird die Höhe des Ankers an die Kachel in der Scene-Ansicht angepasst, ohne dass sich dies auf die Höhe des aufgelösten Ankers zur Laufzeit auswirkt.

  • Wenn das Modell über dem Dach der Bibliothek schweben soll, anstatt darauf zu stehen, ändern Sie den Parameter Altitude relative to rooftop so, dass er 15 Meter über dem Dach liegt.

Das Modell schwebt jetzt über der Bibliothek.

Das Buch hat die richtige Höhe.

Ihr Projekt enthält jetzt eine vollständige Geospatial AR-Szene mit allen erforderlichen AR-Systemkomponenten, einem Geospatial Creator-Ursprung und einem Anker mit einem angehängten Modell.

Als Nächstes erstellen Sie doppelte Anker an zusätzlichen Bibliotheksstandorten.

4. Neue Ankerorte mit der Places API finden

Mit der Places API von Google Maps Platform können Sie Standortdaten für über 200 Millionen Orte abrufen. In diesem Codelab verwenden Sie diese API, um andere Zweigstellen öffentlicher Bibliotheken in San Francisco zu finden und mit diesen Ergebnissen einen Geospatial Creator-Anker für die nächsten zehn Suchergebnisse zu generieren.

  • Klicken Sie zuerst auf Assets > Scripts > Editor (Assets > Scripts > Editor) und öffnen Sie dann die Datei „AnchorDuplicator.cs“. Diese Datei enthält Boilerplate-Code, der Ihnen den Einstieg in die Places API und das Parsen ihrer Ergebnisse erleichtert.

Bei der Places API authentifizieren

  1. Suchen Sie in der Klasse AnchorDuplicator die folgende Zeile:
    private const string API_KEY = "<YOUR_API_KEY_HERE>";
    
  2. Ersetzen Sie <YOUR_API_KEY_HERE> durch den Schlüssel, den Sie in den Einrichtungsschritten erhalten haben.

Places API nach einem Suchbegriff abfragen

Nachdem Sie die Autorisierung für die Places API eingerichtet haben, können Sie Code schreiben, der eine POST-Anfrage initiiert.

  • Suchen Sie dazu die CreatePlacesRequest-Methode und verwenden Sie die folgende Methodendefinition:
    string postBody = "{ \"textQuery\": \"" + searchTerm + "\", " + 
                        "   \"locationBias\": { \"circle\": { " +
                        "      \"center\": { \"latitude\": " + lat + ", \"longitude\": " + lon + " }, " +
                        "      \"radius\": 10000 }" +
                        "   }" +
                        "}";
    
    string url = "https://places.googleapis.com/v1/places:searchText";
    
    UnityWebRequest request = UnityWebRequest.Post(url, postBody, "application/json");
    request.SetRequestHeader("X-Goog-Api-Key", apiKey);
    request.SetRequestHeader("X-Goog-FieldMask", "places.displayName,places.location");
    
    return request;
    
    Wenn die Methode CreatePlacesRequest aufgerufen wird, wird eine Anfrage gesendet, die nach searchTerm in einem Kreis sucht, der um lat und lon zentriert ist.

Arbeit testen

Bevor Sie fortfahren, müssen Sie prüfen, ob die Aufrufe der Places API erfolgreich sind.

  1. Funktionen im Unity-Editor ausführen:
    1. Klicken Sie im Google AR Codelab auf Run Places Request (Orte-Anfrage ausführen).
    2. Öffnen Sie die Unity-Konsole. Es sollten Ergebnisse angezeigt werden.Orte werden in der Console angezeigt

5. Anker programmatisch zu Orten hinzufügen

Nachdem Sie überprüft haben, dass die Places API Ergebnisse findet, erstellen Sie an jedem durch die Ergebnisse angegebenen Ort neue Geospatial Creator-Anker.

Menüpunkt erstellen

  1. Suchen Sie in der Klasse AnchorDuplicator nach der Methode CreateNewAnchorsFromPlaces und verwenden Sie die folgende Methodendefinition:
    if (_places == null)
    {
        Debug.LogError("Cannot create anchors: Places has not been initialized.");
        return;
    }
    
    // You start with only one anchor in the scene, which you want to copy:
    var prototypeAnchorObject = GameObject
        .FindObjectOfType<ARGeospatialCreatorAnchor>()
        .gameObject;
    
    foreach (var place in _places)
    {
        var newAnchorObject = GameObject.Instantiate(prototypeAnchorObject);
        var anchor = newAnchorObject.GetComponent<ARGeospatialCreatorAnchor>();
        anchor.Latitude = place.location.latitude;
        anchor.Longitude = place.location.longitude;
    
        newAnchorObject.name = place.displayName.text;
    }
    
    Mit diesem Menüpunkt wird eine zuvor gestartete Anfrage geprüft und die erste ARGeospatialCreatorAnchor in Ihrer Szene als Prototyp für das Erstellen von Ankern verwendet, einer pro Ort im Places API-Ergebnis.
  2. Verwenden Sie den neuen Menüpunkt Create New Anchors from Places Response (Neue Anker aus Places-Antwort erstellen) im Google AR-Codelab, um die Anker zu erstellen.
  3. Im Bereich Hierarchy (Hierarchie) sollten mehrere Anker angezeigt werden.

Positionen des Ankers überprüfen

So prüfen Sie, ob alle Assets an den richtigen Stellen verankert sind, bevor Sie die App ausführen:

  1. Klicken Sie im Bereich Hierarchie auf einen hinzugefügten Anker.
  2. Drücken Sie F.
  3. Sehen Sie sich den Anker in der Ansicht Scene an.
  4. Wenn sich ein Anker nicht an der richtigen Stelle befindet, klicken Sie auf An Kachel ausrichten oder ändern Sie die Werte für Latitude, Longitude oder Editor Override Altitude manuell.

6. Asset in AR ansehen

So sehen Sie das Asset in AR auf Ihrem ARCore-kompatiblen Android- oder iOS-Gerät:

  1. Klicken Sie auf File > Build Settings und wählen Sie dann entweder die Build-Plattformen Android oder iOS aus.
  2. Klicken Sie auf Plattform wechseln.
  3. Achten Sie darauf, dass Ihr Entwicklungsgerät verbunden und für die Entwicklung konfiguriert ist.
  4. Klicken Sie auf Build and run (Erstellen und ausführen).
  5. Prüfen Sie, ob die App auf Ihrem Gerät ausgeführt wird.
  6. Rufen Sie die Orte auf, an denen Sie die Inhalte verankert haben. Wenn Sie die Beispiele nicht geändert haben, handelt es sich bei den Standorten um öffentliche Bibliotheken in San Francisco.

AR-Ansicht ansehen

7. Fazit

Glückwunsch! Sie haben eine Unity-App geschrieben, in der Geospatial Creator und die Google Maps Platform Places API verwendet werden, um mehrere raumbezogene Erlebnisse auf Grundlage einer Vorlage zu erstellen. Wir hoffen, dass Sie dieses Wissen nutzen können, um die Reichweite Ihrer Geospatial Creator-Inhalte zu erhöhen.

Weitere Informationen