Visualizzare i dati con BigQuery e l'API Datasets

Questo documento fornisce un'architettura di riferimento e un esempio per la creazione di visualizzazioni di dati cartografici con dati sulla posizione in BigQuery di Google Cloud e nell'API Datasets di Google Maps Platform, ad esempio per analizzare dati comunali aperti, creare una mappa di copertura delle telecomunicazioni o visualizzare tracce del movimento di un parco veicoli mobili.

Le visualizzazioni dei dati delle mappe sono un potente strumento per coinvolgere gli utenti e scoprire informazioni spaziali nei dati sulla posizione. I dati sulla posizione sono dati che contengono elementi punto, linea o poligono. Ad esempio, le mappe meteo aiutano i consumatori a comprendere e pianificare i viaggi e a prepararsi alle tempeste; le mappe di business intelligence aiutano gli utenti a scoprire approfondimenti dall'analisi dei dati e le mappe di telecomunicazioni aiutano gli utenti a comprendere la copertura e la qualità dei loro fornitori in una determinata area di servizio.

Tuttavia, è difficile per gli sviluppatori di app creare visualizzazioni di dati cartografici di grandi dimensioni che siano performanti e offrano un'esperienza utente eccezionale. I dati di grandi dimensioni devono essere caricati in memoria lato client, causando tempi di caricamento lenti della prima mappa. L'elemento visivo deve avere un buon rendimento su tutti i dispositivi, inclusi gli smartphone di fascia bassa con limitazioni di memoria e GPU. Infine, gli sviluppatori devono scegliere una libreria di rendering di grandi dati portatile, affidabile e performante con grandi dati.

Architettura di riferimento

Lo sviluppo di app con visualizzazioni di dati di grandi dimensioni richiede due componenti principali.

  1. Backend del cliente: tutti i dati e i servizi dell'app di backend, come l'elaborazione e lo spazio di archiviazione.
  2. Cliente cliente: l'interfaccia utente della tua app con un componente di visualizzazione della mappa.

Di seguito è riportato un diagramma di sistema che mostra come questi due componenti interagiscono con l'utente dell'app, Google Cloud e Google Maps Platform per creare un'app di visualizzazione di dati di grandi dimensioni.

Diagramma dell'architettura

Note sul layout

Esistono una serie di considerazioni di progettazione da seguire per creare una visualizzazione dei dati di alto rendimento utilizzando Google Cloud e la piattaforma Google Maps.

  1. Dimensioni dei dati di origine e frequenza di aggiornamento.
    1. Se i dati di origine in formato GeoJSON sono inferiori a 5 MB o vengono aggiornati molto di frequente, ad esempio una previsione del radar meteo in tempo reale, ti consigliamo di pubblicare i dati come oggetto geojson lato client nella tua app e di eseguire il rendering con un livello deck.gl.
    2. Se i tuoi dati hanno dimensioni superiori a 5 MB e non vengono aggiornati più di una volta all'ora, valuta l'architettura dell'API Datasets in questo documento.
      1. I set di dati supportano file di dimensioni massime pari a 350 MB.
      2. Se i dati sono superiori a 350 MB, ti consigliamo di eliminare o semplificare i dati geometrici nel file di origine prima di passare ai set di dati (vedi Eliminazione dati di seguito).
  2. Schema e formato
    1. Assicurati che i dati abbiano una proprietà ID univoca a livello globale per ogni elemento. Un ID univoco ti consente di selezionare e applicare uno stile a una funzionalità specifica o unire i dati a una funzionalità da visualizzare, ad esempio applicare uno stile a una funzionalità selezionata nell'evento utente "click".
    2. Formatta i dati come CSV o GeoJSON in base alle specifiche dell'API Datasets con nomi di colonne, tipi di dati e tipi di oggetti GeoJSON validi.
    3. Per creare facilmente set di dati da BigQuery, crea una colonna denominata wkt nell'esportazione CSV SQL. Datasets supporta l'importazione della geometria da un file CSV in formato Well-Known Text (WKT) da una colonna denominata wkt.
    4. Verifica che i dati siano geometrie e tipi di dati validi. Ad esempio, i dati GeoJSON devono essere nel sistema di coordinate WGS84, nell'ordine di orientamento della geometria e così via.
    5. Utilizza uno strumento come geojson-validate per assicurarti che tutte le geometrie in un file di origine siano valide o ogr2ogr per trasformare un file di origine tra formati o sistemi di coordinate.
  3. Potatura dei dati
    1. Riduci al minimo il numero di proprietà degli elementi. Puoi unire altre proprietà a una funzionalità in fase di esecuzione in base a una chiave di identificatore univoco (esempio).
    2. Se possibile, utilizza tipi di dati interi per gli oggetti proprietà per ridurre al minimo lo spazio di archiviazione dei riquadri, mantenendone le prestazioni per il caricamento tramite HTTPS in un'app client.
    3. Semplifica e/o aggrega geometrie di elementi molto complesse. Valuta la possibilità di utilizzare funzioni BigQuery come ST_Simplify su geometrie di poligoni complesse per ridurre le dimensioni del file di origine e migliorare le prestazioni della mappa.
  4. Rigolatura
    1. L'API Dataset di Google Maps crea riquadri della mappa dal file di dati di origine per l'utilizzo con un SDK di Maps web o mobile.
    2. I riquadri della mappa sono un sistema di indicizzazione basato sullo zoom che offre metodi più efficienti per caricare i dati in un'app visiva.
    3. I riquadri della mappa potrebbero non mostrare elementi complessi o con una densità elevata a livelli di zoom inferiori. Quando un utente diminuisce lo zoom fino a uno stato o un paese (ad es. z5-z12), la visualizzazione potrebbe essere diversa rispetto a quando aumenta lo zoom su una città o un quartiere (ad es. z13-z18).

Esempio: ferrovie a Londra

In questo esempio, applicheremo l'architettura di riferimento per creare un'applicazione web con Google Cloud e Google Maps che visualizzi tutte le ferrovie di Londra dai dati di Open Street Map (OSM).

Prerequisiti

  1. Accesso a BigQuery Sandbox e alla console Cloud
  2. Assicurati di aver configurato un progetto Google Cloud e un account di fatturazione.

Passaggio 1: esegui query sui dati in BigQuery

Vai a Set di dati pubblici di BigQuery. Il set di dati "bigquery-public-data" e la tabella geo_openstreetmap.planet_features contengono i dati di Open Street Map (OSM) dell'intero globo, incluse tutte le funzionalità possibili. Scopri tutte le funzionalità disponibili per le query nella Wiki di OSM, tra cui amenity, road e landuse.

Utilizza Cloud Shell o la console Cloud BigQuery per eseguire query sulla tabella utilizzando SQL. Il frammento di codice riportato di seguito utilizza il comando bq query per eseguire query su tutte le ferrovie filtrate solo su Londra utilizzando un riquadro delimitante e la funzione ST_Intersects().

Per eseguire questa query da Cloud Shell, esegui il seguente snippet di codice, aggiornando l'ID progetto, il set di dati e il nome della tabella per il tuo ambiente.

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)]
    ))
   )'

La query restituisce:

  1. Un identificatore univoco per ogni elemento osm_id
  2. feature_type ad es. punti, linee e così via
  3. Il name della funzionalità, ad esempio Paddington Station
  4. Il tipo railway, ad esempio principale, turismo, militare e così via
  5. Il wkt dell'elemento: geometria di punto, linea o poligono in formato WKT. WKT è il formato di dati standard restituito dalle colonne di BigQuery Geography in una query.

Nota: per convalidare visivamente i risultati della query prima di creare un set di dati, puoi visualizzare rapidamente i dati in una dashboard di BigQuery utilizzando Looker Studio.

Per esportare la tabella in un file CSV in un bucket Google Cloud Storage, utilizza il comando bq extract in Cloud Shell:

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

Nota:puoi automatizzare ogni passaggio utilizzando Cloud Scheduler per aggiornare regolarmente i dati.

Passaggio 2: crea un set di dati dal file CSV

Poi crea un set di dati di Google Maps Platform dall'output della query su Google Cloud Storage (GCS). Con l'API Datasets, puoi creare un set di dati e poi caricare i dati nel set di dati da un file ospitato su GCS.

Per iniziare, abilita l'API Maps Datasets nel tuo progetto Google Cloud e consulta la documentazione dell'API. Esistono librerie client per Python e Node.js per chiamare l'API Datasets dalla logica nel backend dell'app. Inoltre, è disponibile una interfaccia utente per i set di dati per la creazione manuale dei set di dati in Cloud Console.

Al termine del caricamento del set di dati, puoi visualizzarne un'anteprima nella GUI dei set di dati.

Anteprima del set di dati

Passaggio 4: associa il set di dati a un ID mappa

Una volta creato il set di dati, puoi creare un ID mappa con uno stile di mappa associato. Nell'editor di stili di mappa, puoi associare un ID mappa e uno stile al set di dati. Qui puoi anche applicare la personalizzazione delle mappe basata su cloud per personalizzare l'aspetto della mappa.

Passaggio 5: crea la visualizzazione della mappa dell'app client

Infine, puoi aggiungere il set di dati a un'app di visualizzazione dei dati lato client utilizzando la API Maps JS. Inizializza l'oggetto mappa utilizzando l'ID mappa associato al set di dati del passaggio precedente. Quindi, imposta lo stile e l'interattività del livello Set di dati. Per maggiori dettagli, consulta la guida completa agli stili basati sui dati con i set di dati.

Puoi personalizzare lo stile, aggiungere gestori di eventi per modificarlo dinamicamente e altro ancora utilizzando l'API JS di Maps. Consulta gli esempi nella documentazione. Di seguito definiamo una funzione setStyle per creare lo stile degli elementi punto e linea per questo esempio in base all'attributo "feature_type".

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,
           }
     }
}

Questo codice sopra, quando viene inizializzato in un'app web a pagina singola, genera la seguente visualizzazione dei dati cartografici:

mappa della rete ferroviaria di londra

Da qui, puoi estendere la visualizzazione della mappa nella funzione setStyle() aggiungendo logica per filtrare le funzionalità, aggiungere stili in base all'interazione dell'utente e interagire con il resto dell'applicazione.

Conclusione

In questo documento abbiamo discusso un'architettura di riferimento e un esempio di implementazione di un'applicazione di visualizzazione di dati di grandi dimensioni utilizzando Google Cloud e Google Maps Platform. Utilizzando questa architettura di riferimento, puoi creare app di visualizzazione dei dati sulla posizione da qualsiasi dato in Google Cloud BigQuery che offrono un buon rendimento su qualsiasi dispositivo utilizzando l'API Google Maps Datasets.

Azioni successive

Visita anche:

Collaboratori

Autori principali:

  • Ryan Baumann, Google Maps Platform Solutions Engineering Manager