Visualizzare i dati con BigQuery e l'API Datasets

Questo documento fornisce un'architettura di riferimento e un esempio per la creazione di visualizzazioni dei dati delle mappe con dati sulla posizione in BigQuery della piattaforma Google Cloud e nell'API Datasets della piattaforma Google Maps, ad esempio l'analisi di dati comunali aperti, la creazione di una mappa di copertura delle telecomunicazioni o la visualizzazione delle tracce del movimento del parco veicoli mobile.

Le visualizzazioni dei dati delle mappe sono un potente strumento per coinvolgere gli utenti e scoprire approfondimenti 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 nella memoria lato client, causando tempi di caricamento lenti della prima mappa. L'immagine deve avere un buon rendimento su tutti i dispositivi, inclusi i cellulari di fascia bassa con limitazioni di memoria e GPU. Infine, gli sviluppatori devono scegliere una libreria di rendering di dati di grandi dimensioni che sia portatile, affidabile e con prestazioni elevate con dati di grandi dimensioni.

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 del cliente: l'interfaccia utente dell'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 grandi quantità di dati.

Diagramma dell'architettura

Note sul layout

Esistono una serie di considerazioni di progettazione da seguire per creare una visualizzazione dei dati ad alte prestazioni 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 evoluzione 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 e un account di fatturazione Google Cloud.

Passaggio 1: esegui query sui dati in BigQuery

Vai a Set di dati pubblici 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(https://console.cloud.google.com) per eseguire query sulla tabella utilizzando SQL. Lo snippet di codice seguente utilizza il comando bq query per eseguire query su tutte le ferrovie filtrate solo su Londra utilizzando una casella 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 della piattaforma Google Maps 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 Python e Node.js per chiamare l'API Datasets dalla logica nel backend dell'app. Inoltre, è disponibile una interfaccia utente di Datasets per creare manualmente i set di dati in Cloud Console.

Al termine del caricamento del set di dati, puoi visualizzarne l'anteprima nella GUI 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 mappa associato. Nell'editor di stili mappa, puoi associare un mapId 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 l'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 allo stile basato 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 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,
           }
     }
}

Nota: assicurati di aggiungere sempre l'attribuzione per il tuo set di dati all'app mappe. Per aggiungere l'attribuzione OSM, segui l'esempio di codice di attribuzione nelle documentazioni rispettando le linee guida di OSM.

Questo codice, se inizializzato in un'app web a pagina singola, genera la seguente visualizzazione dei dati della mappa:

mappa della rete ferroviaria di londra

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

Conclusione

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

Azioni successive

Visita anche:

Collaboratori

Autori principali:

  • Ryan Baumann, Solutions Engineering Manager di Google Maps Platform