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 Google Cloud Platform BigQuery und der Google Maps Platform Datasets API, um beispielsweise offene kommunale Daten zu analysieren, eine Karte zur Telekommunikationsabdeckung zu erstellen oder Spuren der Bewegung von Fahrzeugflotten zu visualisieren.

Visualisierungen von Kartendaten sind ein leistungsstarkes Tool, um Nutzer zu begeistern und räumliche Erkenntnisse aus Standortdaten zu gewinnen. Standortdaten sind Daten mit Punkt-, Linien- oder Polygonelementen. Zum Beispiel helfen Wetterkarten den Verbrauchern dabei, Fahrten besser zu verstehen und zu planen sowie sich auf Stürme vorzubereiten. Business-Intelligence-Karten helfen Nutzern, Erkenntnisse aus ihrer Datenanalyse zu gewinnen, und Telekommunikationskarten helfen ihnen, die Abdeckung und Qualität ihrer Dienstleister in einem bestimmten Einzugsgebiet nachzuvollziehen.

Für App-Entwickler ist es jedoch schwierig, Visualisierungen großer Kartendaten zu erstellen, die leistungsstark sind und eine großartige Nutzererfahrung bieten. Große Datenmengen müssen clientseitig geladen werden, wodurch die ersten Kartenladezeiten verlangsamt werden. Die Grafik muss auf allen Geräten leistungsfähig sein, einschließlich Low-End-Mobiltelefonen, die Speicher- und GPU-Einschränkungen haben. Schließlich müssen Entwickler eine große Daten-Rendering-Bibliothek auswählen, die portierbar, zuverlässig und leistungsfähig ist, um große Daten zu verarbeiten.

Referenzarchitektur

Die Entwicklung von Anwendungen mit Visualisierungen großer Daten erfordert zwei Hauptkomponenten.

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

Das folgende Systemdiagramm zeigt, wie diese beiden Komponenten mit dem App-Nutzer, Google Cloud und der Google Maps Platform interagieren, um eine App zur Visualisierung großer Daten zu erstellen.

Architekturdiagramm

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

Designaspekte

Bei der Erstellung einer leistungsfähigen Datenvisualisierung mit Google Cloud und der Google Maps Platform sind eine Reihe von 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, können Sie die Daten in Ihrer App als Geojson-Objektclient 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 Datasets API-Architektur in diesem Dokument in Betracht ziehen.
      1. Datasets unterstützen Dateien mit bis zu 350 MB.
      2. Wenn Ihre Daten größer als 350 MB sind, sollten Sie Geometriedaten in der Quelldatei bereinigen oder vereinfachen, bevor Sie sie an Datasets übergeben (siehe Datenbereinigung unten).
  2. Schema und Format
    1. Achten Sie darauf, dass Ihre Daten für jedes Element eine global eindeutige ID-Property haben. Mit einer eindeutigen ID können Sie ein bestimmtes Element auswählen und gestalten oder Daten mit einem Element verknüpfen, um es zu visualisieren, z. B. das Gestalten eines ausgewählten Elements beim Nutzerereignis „Klick“.
    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ützt den Import von Geometrie aus einer CSV-Datei im WKT-Format (Well-known Text) aus einer Spalte mit dem Namen wkt.
    4. Überprüfen Sie, ob Ihre Daten eine gültige Geometrie und gültige Datentypen haben. GeoJSON muss beispielsweise dem WGS84-Koordinatensystem, der Reihenfolge der Geometrie 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 zwischen Formaten oder Koordinatensystemen zu transformieren.
  3. Datenbereinigung
    1. Minimieren Sie die Anzahl der Eigenschaften von Elementen. Sie können einer Funktion zur Laufzeit zusätzliche Attribute anhand eines eindeutigen Schlüssels zur Kennung zuordnen (Beispiel).
    2. Verwenden Sie nach Möglichkeit Ganzzahl-Datentypen für Eigenschaftsobjekte, um den Speicherplatz für Kacheln zu minimieren, damit Kacheln in einer Clientanwendung über HTTPS geladen werden können.
    3. Vereinfachen und/oder aggregieren Sie sehr komplexe Featuregeometrien. Erwägen Sie die Verwendung von BigQuery-Funktionen wie ST_Simplify für komplexe Polygongeometrien, 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, das effizientere Möglichkeiten zum Laden von Daten in eine visuelle App bietet.
    3. Kartenkacheln können bei niedrigeren Zoomstufen dichte oder komplexe Elemente löschen. Wenn ein Nutzer auf einen Bundesstaat oder ein Land herauszoomt (z.B. z5-z12), sieht das Ergebnis möglicherweise anders aus als beim Heranzoomen einer Stadt oder eines Viertels (z.B. z13-z18).

Beispiel: Eisenbahnen in London

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

Voraussetzungen

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

Schritt 1 – Daten in BigQuery abfragen

Gehen Sie zu Öffentliche BigQuery-Datasets. Das Dataset „bigquery-public-data“ und die Tabelle geo_openstreetmap.planet_features enthalten sämtliche OSM-Daten (Open Street Map) der ganzen Welt, einschließlich aller möglichen Elemente. Entdecken Sie alle Funktionen, die im OSM-Wiki abgefragt werden können, 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. Der folgende Code-Snip verwendet den Befehl bq query, um mithilfe eines Begrenzungsrahmens und der Funktion ST_Intersects() alle nach London gefilterten Bahnstrecken abzufragen.

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. feature_type, z. B. Punkte, Linien usw.
  3. Der name des Elements, z.B. Paddington Station
  4. Der railway-Typ, z. B. „Hauptnummer“, „Tourismus“, „Militär“ usw.
  5. Der wkt des Elements. Dies ist Punkt-, Linien- oder Polygongeometrie im WKT-Format. WKT ist das Standarddatenformat, das BigQuery-Geografiespalten in einer Abfrage zurückgeben.

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

Verwenden Sie den Befehl bqextract in Cloud Shell, um die Tabelle in eine CSV-Datei in einem Google Cloud Storage-Bucket zu exportieren:

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: Dataset aus der CSV-Datei erstellen

Als Nächstes erstellen Sie 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 das 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, um die Datasets API über die Logik in Ihrem App-Back-End aufzurufen. 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 in der Datasets-GUI eine Vorschau des Datasets ansehen.

Dataset-Vorschau

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

Nachdem der Datensatz erstellt wurde, können Sie eine Karten-ID mit einem verknüpften Kartenstil erstellen. Im Kartenstileditor können Sie eine „mapId“ und einen Stil mit dem Dataset verknüpfen. Hier können Sie auch cloudbasiertes Gestalten von Karteninhalten nutzen, um das Erscheinungsbild Ihrer Karte anzupassen.

Schritt 5: Kartenvisualisierung für die Client-App erstellen

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

Mit der Maps JS API können Sie unter anderem den Stil anpassen, Event-Handler hinzufügen, um den Stil dynamisch zu ändern, und vieles mehr. Beispiele finden Sie in der docs. Im Folgenden definieren wir eine setStyle-Funktion zum Erstellen des Punkt- und Linienelementstils für dieses Beispiel basierend auf dem Attribut "feature_type".

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: Sie müssen Ihrer Karten-App immer eine Attribution für Ihren Datensatz hinzufügen. Folgen Sie zum Hinzufügen der OSM-Zuordnung dem Beispiel für den Attributionscode in der Dokumentation unter Einhaltung der OSM-Richtlinien.

Wenn der Code oben in einer einseitigen Web-App initialisiert wird, werden die folgenden Kartendaten angezeigt:

london bahnkarte

Von hier aus können Sie Ihre Kartenvisualisierung in der Funktion setStyle() erweitern, indem Sie Logik zu Filterfunktionen hinzufügen, Stile basierend auf Nutzerinteraktionen hinzufügen und mit dem Rest Ihrer Anwendung interagieren.

Fazit

In diesem Artikel wurden eine Referenzarchitektur und eine Beispielimplementierung einer Anwendung zur Visualisierung großer Daten mithilfe von Google Cloud und der Google Maps Platform beschrieben. Mit dieser Referenzarchitektur können Sie mit der Google Maps Datasets API aus beliebigen Daten in GCP BigQuery Apps zur Visualisierung von Standortdaten erstellen, die auf jedem Gerät leistungsfähig sind.

Nächste Aktionen

Zum Weiterlesen:

Beitragende

Hauptautoren:

  • Ryan Baumann, Google Maps Platform Solutions Engineering Manager