Dieses Dokument enthält eine Referenzarchitektur und ein Beispiel zum Erstellen von Kartendatenvisualisierungen mit Standortdaten in Google Cloud Platform BigQuery und der Google Maps Platform Datasets API, z. B. zum Analysieren offener behördlicher Daten, zum Erstellen einer Karte der Telekommunikationsabdeckung oder zum Visualisieren von Spuren der Bewegung einer mobilen Fahrzeugflotte.
Kartendatenvisualisierungen sind ein leistungsstarkes Tool, um Nutzer zu erreichen und räumliche Informationen in Standortdaten zu gewinnen. Standortdaten sind Daten mit Punkt-, Linien- oder Polygonelementen. Wetterkarten helfen Verbrauchern beispielsweise, Reisen 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 Servicegebiet zu verstehen.
Es ist jedoch schwierig für App-Entwickler, große Kartendatenvisualisierungen zu erstellen, die leistungsstark sind und eine hervorragende Nutzererfahrung bieten. Große Daten müssen clientseitig in den Arbeitsspeicher geladen werden, was zu langen Ladezeiten der Karte führt. Das visuelle Element muss auf allen Geräten leistungsfähig sein, einschließlich preiswerterer Smartphones mit Arbeitsspeicher- und GPU-Einschränkungen. Schließlich müssen Entwickler eine große Daten-Rendering-Bibliothek auswählen, die portabel, zuverlässig und leistungsstark bei großen Datenmengen ist.
Referenzarchitektur
Für die Entwicklung von Apps mit großen Datenvisualisierungen sind zwei Hauptkomponenten erforderlich.
- Kunden-Backend: Alle Back-End-App-Daten und ‑Dienste wie Verarbeitung und Speicherung.
- Kundenclient: Die Benutzeroberfläche Ihrer App mit einer Kartenvisualisierungskomponente.
Unten 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 Datenvisualisierungs-App zu erstellen.
Designaspekte
Es gibt eine Reihe von Designüberlegungen, die Sie beachten sollten, um mit Google Cloud und der Google Maps Platform eine leistungsstarke Datenvisualisierung zu erstellen.
- Größe der Quelldaten und Aktualisierungshäufigkeit
- Wenn die Quelldaten im GeoJSON-Format weniger als 5 MB groß sind oder sehr häufig aktualisiert werden, z.B. eine Live-Wetterradarvorhersage, sollten Sie die Daten clientseitig in Ihrer App als GeoJSON-Objekt bereitstellen und mit einer deck.gl-Ebene rendern.
- Wenn Ihre Daten mehr als 5 MB groß sind und nicht schneller als einmal pro Stunde aktualisiert werden, sollten Sie die Datasets API-Architektur in diesem Dokument verwenden.
- Datasets unterstützen Dateien mit einer Größe von bis zu 350 MB.
- Wenn Ihre Daten größer als 350 MB sind, sollten Sie die Geometriedaten in der Quelldatei bereinigen oder vereinfachen, bevor Sie sie an Datasets übergeben (siehe Datenbereinigung unten).
- Schema und Format
- Ihre Daten müssen für jedes Element eine global eindeutige ID-Eigenschaft haben. Mit einer eindeutigen ID können Sie ein bestimmtes Element auswählen und einen Stil dafür festlegen oder Daten mit einem Element verknüpfen, um es zu visualisieren. So können Sie beispielsweise einen Stil für ein ausgewähltes Element für das Nutzerereignis „Klick“ festlegen.
- Formatieren Sie Ihre Daten gemäß der Datasets API-Spezifikation im CSV- oder GeoJSON-Format mit gültigen Spaltennamen, Datentypen und GeoJSON-Objekttypen.
- Wenn Sie Datasets ganz einfach aus BigQuery erstellen möchten, 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 Well-Known Text-Format (WKT) aus einer Spalte namenswkt. - Prüfen Sie, ob Ihre Daten gültige Geometrien und Datentypen haben. Beispielsweise muss GeoJSON im WGS84-Koordinatensystem vorliegen und die Geometrie muss in der richtigen Reihenfolge verlaufen.
- 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.
- Datenentfernung
- Minimieren Sie die Anzahl der Eigenschaften von Elementen. Sie können einer Funktion bei der Laufzeit zusätzliche Properties über einen eindeutigen Schlüssel für die Kennzeichnung zusammenführen (Beispiel).
- Verwenden Sie nach Möglichkeit Ganzzahldatentypen für Ortsobjekte, um den Speicherplatz für Kacheln zu minimieren und die Leistung der Kacheln beim Laden über HTTPS in einer Client-App beizubehalten.
- Vereinfachen und/oder aggregieren Sie sehr komplexe Featuregeometrien. Verwenden Sie BigQuery-Funktionen wie ST_Simplify für komplexe Polygongeometrien, um die Größe der Quelldatei zu reduzieren und die Kartenleistung zu verbessern.
- Kachelung
- Mit der Google Maps Datasets API werden Kartenkacheln aus Ihrer Quelldatendatei für die Verwendung mit einem Web- oder mobilen Maps SDK erstellt.
- Kartenkacheln sind ein zoombasiertes Indexierungssystem, mit dem Daten effizienter in eine visuelle App geladen werden können.
- Bei niedrigeren Zoomstufen werden auf Kartenkacheln möglicherweise dicht beieinander liegende oder komplexe Elemente nicht dargestellt. Wenn ein Nutzer herauszoomt auf einen US-Bundesstaat oder ein Land (z.B. z5–z12), sieht die Karte möglicherweise anders aus als beim Heranzoomen auf eine Stadt oder ein Viertel (z.B. z13–z18).
Beispiel: Bahnen in London
In diesem Beispiel wenden wir die Referenzarchitektur an, um eine Webanwendung mit der GCP und Google Maps zu erstellen, die alle Bahnlinien in London anhand von Open Street Map-Daten (OSM) visualisiert.
Vorbereitung
- Zugriff auf die BigQuery-Sandbox und die Cloud Console
- Sie müssen ein GCP-Projekt und ein Rechnungskonto eingerichtet haben.
Schritt 1: Daten in BigQuery abfragen
Rufen Sie Öffentliche BigQuery-Datasets auf. Der Datensatz „bigquery-public-data“ und die Tabelle geo_openstreetmap.planet_features enthalten Open Street Map-Daten (OSM) für den gesamten Globus, einschließlich aller möglichen Funktionen. Im OSM-Wiki finden Sie alle verfügbaren Funktionen, die Sie abfragen können, einschließlich amenity, road und landuse.
Verwenden Sie die Cloud Shell oder die BigQuery Cloud Console(https://console.cloud.google.com), um die Tabelle mit SQL abzufragen. Im folgenden Code-Snippet wird mit dem Befehl bq query eine Abfrage für alle Eisenbahnen ausgeführt, die mithilfe eines Begrenzungsrahmens und der Funktion ST_Intersects() auf London beschränkt sind.
Wenn Sie diese Abfrage in Cloud Shell ausführen möchten, führen Sie den folgenden Code-Snippet aus und 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:
- Eine eindeutige Kennung für jedes Element
osm_id - die
feature_type, z. B. Punkte, Linien usw. - Die
namedes Elements, z.B.Paddington Station - Der
railway-Typ, z. B. Hauptstraße, Tourismus, Militär usw. - Die
wktdes Elements – Punkt-, Linien- oder Polygongeometrie im WKT-Format. WKT ist das Standarddatenformat, das in BigQuery-Geografiespalten in einer Abfrage zurückgegeben wird.
Hinweis: Wenn Sie die Abfrageergebnisse vor dem Erstellen eines Datensatzes visuell prüfen möchten, können Sie Ihre Daten mit Looker Studio schnell in einem Dashboard aus BigQuery visualisieren.
Verwenden Sie den Befehl bq extract 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 CSV-Datei erstellen
Erstellen Sie als Nächstes einen Google Maps Platform-Datensatz aus der Abfrageausgabe in Google Cloud Storage (GCS). Mit der Datasets API können Sie einen Datensatz erstellen und dann Daten aus einer Datei, die in GCS gehostet wird, in Ihren Datensatz 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 Sie die Datasets API über die Logik in Ihrem App-Backend aufrufen können. Außerdem gibt es eine Datasets-GUI, mit der Sie Datasets manuell in der Cloud Console erstellen können.
Nachdem der Upload des Datensatzes abgeschlossen ist, können Sie sich eine Vorschau des Datensatzes in der Benutzeroberfläche für Datensätze ansehen.
Schritt 4: Datensatz mit einer Karten-ID verknüpfen
Nachdem Sie das Dataset erstellt haben, können Sie eine Karten-ID mit einem zugehörigen Kartenstil erstellen. Im Kartenstil-Editor können Sie dem Datensatz eine Karten-ID und einen Stil zuweisen. Hier können Sie auch cloudbasierte Kartenstile anwenden, um das Erscheinungsbild Ihrer Karte anzupassen.
Schritt 5: Kartenvisualisierung für die Client-App erstellen
Schließlich können Sie den Datensatz mithilfe der Maps JS API einer clientseitigen Datenvisualisierungs-App hinzufügen. Initialisieren Sie das Kartenobjekt mit der Karten-ID, die mit Ihrem Dataset aus dem vorherigen Schritt verknüpft ist. Legen Sie dann den Stil und die Interaktivität der Datensatzebene fest. Weitere Informationen finden Sie in der vollständigen Anleitung zum datengetriebenen Styling mit Datasets.
Mit der Maps JS API können Sie den Stil anpassen, Ereignishandler hinzufügen, um den Stil dynamisch zu ändern, und vieles mehr. Beispiele finden Sie in der Dokumentation. Unten definieren wir eine Funktion „setStyle“, um den Punkt- und Linienelementstil für dieses Beispiel basierend auf dem Attribut „feature_type“ zu erstellen.
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: Fügen Sie Ihrer Kartenanwendung immer eine Quellenangabe für Ihren Datensatz hinzu. Wenn Sie eine OSM-Quellenangabe hinzufügen möchten, folgen Sie dem Beispiel für den Quellencode in der Dokumentation und beachten Sie die OSM-Richtlinien.
Wenn der Code oben in einer Single-Page-Web-App initialisiert wird, ergibt sich die folgende Visualisierung von Kartendaten:
Hier können Sie die Kartenvisualisierung in der Funktion „setStyle()“ erweitern, indem Sie Filterfunktionen Logik hinzufügen, ein Styling basierend auf Nutzerinteraktionen hinzufügen und mit dem Rest Ihrer Anwendung interagieren.
Fazit
In diesem Artikel haben wir eine Referenzarchitektur und eine Beispielimplementierung einer großen Datenvisualisierungsanwendung mit Google Cloud und der Google Maps Platform besprochen. Mit dieser Referenzarchitektur können Sie Apps zur Visualisierung von Standortdaten aus beliebigen Daten in GCP BigQuery erstellen, die mit der Google Maps Datasets API auf jedem Gerät leistungsfähig sind.
Nächste Aktionen
Zum Weiterlesen:
- Dokumentation zur Google Maps Platform Datasets API
- Daten in Echtzeit mit datengestützten Stilen ansehen
- Einführung in georäumliche Analysen in BigQuery
- GeoJSON in BigQuery für raumbezogene Analysen verwenden
Beitragende
Hauptautoren:
- Ryan Baumann, Google Maps Platform Solutions Engineering Manager