Daten mit der BigQuery und Datasets API visualisieren

Dieses Dokument enthält eine Referenzarchitektur und ein Beispiel für die Erstellung von Kartendatenvisualisierungen mit Standortdaten in BigQuery und der Google Maps Platform Datasets API. Sie können z. B. offene kommunale Daten analysieren, eine Karte zur Telekommunikationsabdeckung erstellen oder die Bewegungen der Fahrzeugflotte visualisieren.

Visualisierungen für Kartendaten sind ein leistungsstarkes Tool, um Nutzer anzusprechen und räumliche Einblicke in Standortdaten zu erhalten. Standortdaten sind Daten, die Punkt-, Linien- oder Polygonmerkmale enthalten. Zum Beispiel helfen Wetterkarten Verbrauchern dabei, Fahrten zu verstehen und zu planen und sich auf Stürme vorzubereiten. Business-Intelligence-Karten helfen Nutzern, Erkenntnisse aus ihrer Datenanalyse zu gewinnen, und Telekommunikationskarten helfen Nutzern, die Abdeckung und Qualität ihrer Anbieter in einem bestimmten Einzugsgebiet zu verstehen.

Für App-Entwickler ist es jedoch schwierig, umfangreiche Kartendatenvisualisierungen zu erstellen, die leistungsstark und nutzerfreundlich sind. Große Daten müssen clientseitig in den Arbeitsspeicher geladen werden, was zu langen Kartenladezeiten führt. Das Bild muss auf allen Geräten, einschließlich Low-End-Smartphones mit Speicher- und GPU-Einschränkungen, gut funktionieren. Schließlich müssen die Entwickler eine große Daten-Rendering-Bibliothek auswählen, die portabel, zuverlässig und mit großen Datenmengen leistungsfähig ist.

Referenzarchitektur

Die Entwicklung von Anwendungen mit umfangreichen Datenvisualisierungen erfordert zwei Hauptkomponenten.

  1. Kunden-Back-End: alle Back-End-App-Daten und -Dienste, z. B. Verarbeitung und Speicher
  2. Kundenclient: Die Benutzeroberfläche Ihrer App mit einer Komponente zur Kartenvisualisierung.

Im Folgenden sehen Sie ein Systemdiagramm, das zeigt, wie diese beiden Komponenten mit dem App-Nutzer, Google Cloud und der Google Maps Platform interagieren, um eine große App zur Datenvisualisierung zu erstellen.

Architekturdiagramm

⭐ Hinweis: Die Maps Datasets API ist ein pre-GA-Produkt. Weitere Informationen finden Sie in den Nutzungsbedingungen.

Designaspekte

Beim Erstellen einer leistungsfähigen Datenvisualisierung mit Google Cloud und der Google Maps Platform sind einige Designüberlegungen zu beachten.

  1. Größe der Quelldaten und Aktualisierungshäufigkeit:
    1. Wenn die Quelldaten im GeoJSON-Format kleiner als 5 MB sind oder sehr häufig aktualisiert werden, z.B. bei einer Live-Wettervorhersage, sollten Sie die Daten als clientseitiges GeoJSON-Objekt in Ihrer App bereitstellen und mit einer deck.gl-Ebene rendern.
    2. Wenn Ihre Daten größer als 5 MB sind und nicht schneller als einmal pro Stunde aktualisiert werden, sollten Sie die Architektur der Datasets API in diesem Dokument in Betracht ziehen.
      1. Datasets unterstützen Dateien mit einer Größe von bis zu 350 MB.
      2. Wenn Ihre Daten größer als 350 MB sind, sollten Sie die Geometriedaten in der Quelldatei kürzen oder vereinfachen, bevor Sie sie an Datasets übergeben (siehe Datenbereinigung weiter unten).
  2. Schema und Format
    1. Achten Sie darauf, dass Ihre Daten für jedes Element eine global eindeutige ID-Property haben. Mithilfe einer eindeutigen ID können Sie ein bestimmtes Element auswählen und gestalten oder Daten mit einem Element verknüpfen, um es zu visualisieren. So lässt sich beispielsweise ein ausgewähltes Element für das Nutzerereignis „Klick“ gestalten.
    2. Formatieren Sie Ihre Daten als CSV oder GeoJSON gemäß der Datasets API-Spezifikation mit gültigen Spaltennamen, Datentypen und Typen von GeoJSON-Objekten.
    3. Zum einfachen Erstellen von Datasets aus BigQuery erstellen Sie in Ihrem SQL-CSV-Export eine Spalte mit dem Namen wkt. Datasets unterstützen den Import von Geometrie aus einer CSV-Datei im Well-Known Text-Format (WKT) aus einer Spalte mit dem Namen wkt.
    4. Prüfen Sie, ob Ihre Daten gültige Geometrie und Datentypen haben. GeoJSON muss beispielsweise dem WGS84-Koordinatensystem, der Geometrie-Wundungsreihenfolge usw. entsprechen.
    5. Verwenden Sie ein Tool wie geojson-validate, um sicherzustellen, dass alle Geometrien in einer Quelldatei gültig sind, oder ogr2ogr, um eine Quelldatei in andere Formate oder Koordinatensysteme umzuwandeln.
  3. Datenbereinigung
    1. Minimieren Sie die Anzahl der Eigenschaften von Elementen. Sie können einem Feature zur Laufzeit zusätzliche Attribute mit einem eindeutigen ID-Schlüssel verknüpfen (Beispiel).
    2. Verwenden Sie nach Möglichkeit Ganzzahl-Datentypen für Eigenschaftsobjekte, um den Kachelspeicherplatz zu minimieren und dafür zu sorgen, dass die Kacheln in einer Client-App über HTTPS geladen werden können.
    3. Vereinfachen und/oder aggregieren Sie sehr komplexe Featuregeometrien. Ziehen Sie die Verwendung von BigQuery-Funktionen wie ST_Simplify für komplexe Polygongeometrien in Betracht, um die Größe der Quelldatei zu verringern und die Kartenleistung zu verbessern.
  4. Tiling
    1. Die Google Maps Datasets API erstellt Kartenkacheln aus Ihrer Quelldatendatei zur Verwendung in der Maps JS API.
    2. Kartenkacheln sind ein zoombasiertes Indexierungssystem, mit dem Daten effizienter in eine visuelle App geladen werden können.
    3. Bei niedrigeren Zoomstufen können auf Kartenkacheln dichte oder komplexe Elemente abgelegt werden. Verkleinert ein Nutzer einen Bundesstaat oder ein Land (z.B. z5-z12), kann dies anders aussehen als beim Heranzoomen einer Stadt oder eines Viertels (z.B. z13-z18).

Beispiel: Bahnstrecken in London

In diesem Beispiel wenden wir die Referenzarchitektur an, um mit der GCP und Google Maps eine Webanwendung zu erstellen, mit der alle Bahnstrecken in London anhand von Open Street Map-Daten (OSM) visualisiert werden.

Voraussetzungen

  1. Zugriff auf BigQuery Sandbox und die Cloud Console
  2. Sie müssen ein GCP-Projekt und ein Rechnungskonto eingerichtet haben.

Schritt 1 – Daten in BigQuery abfragen

Rufen Sie Öffentliche BigQuery-Datasets auf. Das Dataset „bigquery-public-data“ und die Tabelle geo_openstreetmap.planet_features enthalten alle Open Street Map-Daten (OSM) des gesamten Globus, einschließlich aller möglichen Elemente. Alle Funktionen für Abfragen finden Sie im OSM Wiki, darunter amenity, road und landuse.

Verwenden Sie Cloud Shell oder die BigQuery Cloud Console(https://console.cloud.google.com), um die Tabelle mit SQL abzufragen. Im folgenden Code-Snip wird mit dem Befehl bq query alle Bahnstrecken abgefragt, die nur nach London gefiltert wurden. Dazu werden ein Begrenzungsrahmen und die Funktion ST_Intersects() verwendet.

Führen Sie den folgenden Code-Snip aus, um diese Abfrage in Cloud Shell auszuführen. Aktualisieren Sie dabei die Projekt-ID, das Dataset und den Tabellennamen für Ihre Umgebung.

bq query --use_legacy_sql=false \
--destination_table PROJECTID:DATASET.TABLENAME \
--replace \
'SELECT
osm_id, 
feature_type,
(SELECT value
         FROM   unnest(all_tags)
         WHERE  KEY = "name") AS name,
(SELECT value
         FROM   unnest(all_tags)
         WHERE  KEY = "railway") AS railway,
geometry as wkt
FROM   bigquery-public-data.geo_openstreetmap.planet_features
WHERE ("railway") IN (SELECT key FROM unnest(all_tags)) 
    AND ST_Intersects(
    geometry,
ST_MakePolygon(ST_MakeLine(
      [ST_GeogPoint(-0.549370, 51.725346),
      ST_GeogPoint(-0.549370, 51.2529407),
      ST_GeogPoint(0.3110581, 51.25294),
      ST_GeogPoint(0.3110581, 51.725346),
      ST_GeogPoint(-0.549370, 51.725346)]
    ))
   )'

Die Abfrage gibt Folgendes zurück:

  1. eine eindeutige Kennung für jedes Element osm_id
  2. das feature_type (z. B. Punkte, Linien usw.)
  3. Der name des Elements, z.B. Paddington Station
  4. Der railway-Typ, z. B. Mainstream, Tourismus, Militär usw.
  5. Die wkt des Elements – Punkt, Linie oder Polygongeometrie im WKT-Format. WKT ist das Standarddatenformat von BigQuery-Geografiespalten, die in einer Abfrage zurückgegeben werden.

Hinweis: Wenn Sie die Abfrageergebnisse vor dem Erstellen eines Datasets visuell validieren möchten, können Sie die Daten in Looker Studio in einem Dashboard von BigQuery visualisieren.

Um die Tabelle in eine CSV-Datei in einem Google Cloud Storage-Bucket zu exportieren, verwenden Sie den Befehl bq extra in Cloud Shell:

bq extract \
--destination_format "CSV" \
--field_delimiter "," \
--print_header=true \
PROJECTID:DATASET.TABLENAME \
gs://BUCKET/FILENAME.csv

Hinweis:Sie können jeden Schritt mit Cloud Scheduler automatisieren, um Ihre Daten regelmäßig zu aktualisieren.

Schritt 2: Datensatz aus Ihrer CSV-Datei erstellen

Erstellen Sie als Nächstes ein Google Maps Platform-Dataset aus der Abfrageausgabe in Google Cloud Storage (GCS). Mit der Datasets API können Sie ein Dataset erstellen und dann aus einer in GCS gehosteten Datei Daten in Ihr Dataset hochladen.

Aktivieren Sie zuerst die Maps Datasets API in Ihrem GCP-Projekt und lesen Sie die API-Dokumentation. Es gibt Python- und Node.js-Clientbibliotheken, mit denen die Datasets API über die Logik im Back-End Ihrer Anwendung aufgerufen werden kann. Darüber hinaus gibt es eine Datasets-GUI, mit der Sie Datasets manuell in der Cloud Console erstellen können.

Nachdem der Dataset-Upload abgeschlossen ist, können Sie sich eine Vorschau des Datasets auf der Datasets-GUI ansehen.

Dataset-Vorschau

Schritt 4: Datensatz mit einer Karten-ID verknüpfen

Nachdem das Dataset erstellt wurde, kannst du eine Karten-ID mit einem verknüpften Kartenstil erstellen. Im Kartenstil-Editor können Sie eine Karten-ID und einen Stil mit dem Dataset verknüpfen. Hier können Sie auch cloudbasiertes Gestalten von Karteninhalten anwenden, um das Erscheinungsbild Ihrer Karte anzupassen.

Schritt 5: Kartenvisualisierung der Client-App erstellen

Schließlich können Sie den Datensatz mithilfe der Maps JS API in eine clientseitige App zur Datenvisualisierung einfügen. Initialisieren Sie Ihr Kartenobjekt mit der MapID, die im vorherigen Schritt mit Ihrem Dataset verknüpft ist. Legen Sie dann den Stil und die Interaktivität Ihrer Dataset-Ebene fest. Weitere Informationen finden Sie in einem vollständigen Leitfaden zu datengestützten Stilen mit Datasets.

Mit dem Maps JS API können Sie den Stil anpassen und Event-Handler für eine dynamische Änderung des Stils hinzufügen. Beispiele finden Sie in der docs. Im Folgenden definieren wir eine setStyle-Funktion, um den Punkt- und Linienelementstil für dieses Beispiel basierend auf dem Attribut "feature_type" zu erstellen.

Hinweis: Verwenden Sie für Ihre Maps JS API-Implementierung den Kanal v=beta.

function setStyle(params) {
  const map.getDatasetFeatureLayer("your-dataset-id");
  const datasetFeature = params.feature;
  const type = datasetFeature.datasetAttributes["feature_type"];
if (type == "lines") {
           return {
             fillColor: "blue",
             strokeColor: "blue",
             fillOpacity: 0.5,
             strokeWeight: 1,
           }
         } else if (type == "points") {
           return {
             fillColor: "black",
             strokeColor: "black",
             strokeOpacity: 0.5,
             pointRadius: 2,
             fillOpacity: 0.5,
             strokeWeight: 1,
           }
     }
}

Hinweis: Achten Sie darauf, dass Sie Ihrer Karten-App immer eine Quellenangabe für Ihr Dataset hinzufügen. Folgen Sie dazu dem Codebeispiel für Quellenangaben in der Dokumentation und beachten Sie die OSM-Richtlinien.

Wenn dieser Code oben in einer einseitigen Web-App initialisiert wird, liefert er folgendes visuelles Element der Kartendaten:

London Railway Karte

Von hier aus können Sie die Kartenvisualisierung in der Funktion setStyle() erweitern, indem Sie Logik zum Filtern von Elementen hinzufügen, Stile basierend auf der Nutzerinteraktion hinzufügen und mit dem Rest Ihrer Anwendung interagieren.

Fazit

In diesem Artikel haben wir eine Referenzarchitektur und eine Beispielimplementierung für eine Anwendung zur Visualisierung großer Daten mit Google Cloud und der Google Maps Platform besprochen. Mithilfe dieser Referenzarchitektur können Sie mit der Google Maps Datasets API Anwendungen zur Visualisierung von Standortdaten aus beliebigen Daten in BigQuery in der GCP erstellen, die auf jedem Gerät leistungsfähig sind.

Nächste Aktionen

Zum Weiterlesen:

Beitragende

Hauptautoren:

  • Ryan Baumann, Google Maps Platform Solutions Engineering Manager