Visualizar seus dados com o BigQuery e a API Datasets

Neste documento, apresentamos uma arquitetura de referência e um exemplo de como criar visualizações de dados de mapa com dados de local no BigQuery do Google Cloud Platform e na API Datasets da Plataforma Google Maps, por exemplo, analisando dados municipais abertos, criando um mapa de cobertura de telecomunicações ou visualizando rastros de movimento da frota de veículos móveis.

As visualizações de dados de mapa são uma ferramenta poderosa para envolver os usuários e revelar insights espaciais nos dados de local. Os dados de local têm elementos de ponto, linha ou polígono. Por exemplo, mapas meteorológicos ajudam os consumidores a entender e planejar viagens e se preparar para tempestades. os mapas de Business Intelligence ajudam os usuários a descobrir insights a partir da análise de dados, e os mapas de telecomunicações ajudam os usuários a entender os provedores de serviços cobertura e qualidade em uma determinada área de serviço.

No entanto, é difícil para os desenvolvedores de aplicativos fazer visualizações grandes de dados de mapas com bom desempenho e uma ótima experiência do usuário. Há muitos dados que devem ser carregados no lado do cliente da memória, causando lentidão no primeiro carregamento do mapa. O visual deve ter bom desempenho em todos os dispositivos, incluindo celulares mais simples com restrições de memória e GPU. Por fim, os desenvolvedores precisam escolher uma grande biblioteca de renderização de dados que seja portátil, confiável e tenha bom desempenho com grandes dados.

Arquitetura de referência

O desenvolvimento de aplicativos com grandes visualizações de dados requer dois componentes principais.

  1. Back-end do cliente: todos os dados de back-end do app e como processamento e armazenamento.
  2. Cliente do cliente: a interface do usuário do seu app com um componente de visualização de mapa.

Confira abaixo um diagrama do sistema que mostra como esses dois componentes interagem com o usuário do app, o Google Cloud e a Plataforma Google Maps para criar um app grande de visualização de dados.

diagrama da arquitetura

Considerações sobre o design

Há uma série de considerações de design a serem seguidas para criar uma visualização de dados de alta performance usando o Google Cloud e a Plataforma Google Maps.

  1. Tamanho dos dados de origem e frequência de atualização.
    1. Se os dados de origem em formato geojson tiverem menos de 5 MB ou forem atualizados com muita frequência, por exemplo, uma previsão de radar meteorológico em tempo real, disponibilize dados como um objeto geojson no lado do cliente no seu app e renderize com uma camada deck.gl.
    2. Se os dados tiverem mais de 5 MB e forem atualizados no máximo uma vez por hora, considere a arquitetura da API Datasets deste documento.
      1. Os conjuntos de dados aceitam arquivos de até 350 MB.
      2. Se os dados forem maiores que 350 MB, considere remover ou simplificar os dados de geometria no arquivo de origem antes de passá-los para os Conjuntos de dados. Consulte "Remoção de dados" abaixo.
  2. Esquema e formato
    1. Verifique se os dados têm uma propriedade de ID globalmente exclusiva para cada recurso. Com um ID exclusivo, você pode selecionar e estilizar um recurso específico ou mesclar dados a um recurso para visualização, por exemplo, estilizando um recurso selecionado no evento de usuário "clique".
    2. Formate seus dados como CSV ou GeoJSON de acordo com a especificação da API Datasets com nomes de coluna, tipos de dados e tipos de objetos GeoJSON válidos.
    3. Para facilitar a criação de conjuntos de dados do BigQuery, crie uma coluna chamada wkt na exportação de CSV para SQL. Os conjuntos de dados aceitam a importação de geometria de um CSV no formato Texto conhecido (WKT, na sigla em inglês) de uma coluna chamada wkt.
    4. Verifique se seus dados são tipos válidos de dados e geometria. Por exemplo, o GeoJSON precisa estar no sistema de coordenadas WGS84, na ordem de enrolamento da geometria etc.
    5. Use uma ferramenta como geojson-validate para garantir que todas as geometrias em um arquivo de origem sejam válidas ou ogr2ogr para transformar um arquivo de origem entre formatos ou sistemas de coordenadas.
  3. Remoção de dados
    1. Minimizar o número de propriedades dos atributos. É possível associar outras propriedades a um recurso no momento da execução em uma chave de identificador exclusivo (exemplo).
    2. Use tipos de dados inteiros para objetos de propriedade sempre que possível para minimizar o espaço de armazenamento do bloco, mantendo o desempenho dos blocos no carregamento por HTTPS em um app cliente.
    3. Simplificar e/ou agregar geometrias de atributos muito complexas. use funções do BigQuery, como ST_Simplify, em geometrias complexas de polígono, para reduzir o tamanho do arquivo de origem e melhorar o desempenho do mapa.
  4. Camadas
    1. A API Google Maps Datasets cria blocos de mapas do seu arquivo de dados de origem para uso com um SDK do Maps da Web ou para dispositivos móveis.
    2. Os blocos de mapas são um sistema de indexação baseado em zoom que oferece maneiras mais eficientes de carregar dados em um app visual.
    3. Os blocos de mapa podem eliminar elementos densos ou complexos em níveis de zoom mais baixos. Quando um usuário diminui o zoom em um estado ou país (por exemplo, z5-z12), pode ser diferente do zoom em uma cidade ou bairro (por exemplo, z13-z18).

Exemplo: ferrovias em Londres

Neste exemplo, vamos aplicar a arquitetura de referência para criar um aplicativo da Web com o GCP e o Google Maps que visualiza todas as ferrovias em Londres a partir dos dados do Open Street Map (OSM).

Pré-requisitos

  1. Acesso ao sandbox do BigQuery e ao console do Cloud
  2. Verifique se você tem um projeto do GCP e uma conta de faturamento configurada.

Etapa 1: consultar dados no BigQuery

Navegue até Conjuntos de dados públicos do BigQuery. O conjunto de dados "bigquery-public-data" e a tabela geo_openstreetmap.planet_features contém os dados de mapas abertos do mapa de ruas (OSM, na sigla em inglês) de todo o globo, incluindo todos os elementos possíveis. Descubra todos os recursos disponíveis para consulta na Wiki do OSM, incluindo amenity, road e landuse.

Use o Cloud Shell ou o console do Cloud do BigQuery(https://console.cloud.google.com) para consultar a tabela usando SQL. O trecho de código abaixo usa o comando bq query para consultar todas as ferrovias filtradas para Londres usando uma caixa delimitadora e a função ST_Intersects().

Para realizar essa consulta no Cloud Shell, execute o snippet de código a seguir, atualizando o ID do projeto, o conjunto de dados e o nome da tabela do seu 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)]
    ))
   )'

A consulta retorna:

  1. um identificador exclusivo para cada atributo osm_id
  2. o feature_type. Por exemplo: pontos, linhas, etc.
  3. O name do recurso, por exemplo, Paddington Station
  4. O tipo railway, por exemplo, principal, turismo, militar, etc.
  5. O wkt do elemento: geometria de ponto, linha ou polígono no formato WKT. O WKT é o formato de dados padrão que as colunas geográficas do BigQuery retornam em uma consulta.

Observação: para validar visualmente os resultados da consulta antes de criar um conjunto de dados, visualize seus dados rapidamente em um painel do BigQuery usando o Looker Studio.

Para exportar a tabela para um arquivo CSV em um bucket do Google Cloud Storage, use o comando bq extract no Cloud Shell:

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

Observação:é possível automatizar cada etapa usando o Cloud Scheduler para atualizar seus dados regularmente.

Etapa 2: criar um conjunto de dados a partir do arquivo CSV

Em seguida, crie um conjunto de dados da Plataforma Google Maps a partir do resultado da consulta no Google Cloud Storage (GCS). Com a API Datasets, é possível criar um conjunto de dados e fazer upload dos dados para ele a partir de um arquivo hospedado no GCS.

Para começar, ative a API Maps Datasets no projeto do GCP e analise a documentação da API. Existem bibliotecas de cliente Python e Node.js para chamar a API Datasets a partir da lógica no back-end do app. Além disso, há uma GUI de conjuntos de dados para criar conjuntos manualmente no console do Cloud.

Depois que o upload do conjunto de dados for concluído, você poderá visualizar seu conjunto de dados na GUI de conjuntos de dados.

Prévia do conjunto de dados

Etapa 4: associar seu conjunto de dados a um ID do mapa

Depois que o conjunto de dados for criado, você poderá criar um ID de mapa com um estilo de mapa associado. No Editor de estilo de mapa, você pode associar um mapId e um estilo ao conjunto de dados. Também é possível aplicar a Estilização de mapas baseada na nuvem para personalizar a aparência do mapa.

Etapa 5: criar a visualização de mapa do app cliente

Por fim, você pode adicionar o conjunto de dados a um app de visualização de dados do lado do cliente usando a API Maps JS. Inicialize seu objeto "map" usando o mapID associado ao conjunto de dados da etapa anterior. Em seguida, defina o estilo e a interatividade da camada de conjunto de dados. Para mais detalhes, confira um guia completo sobre estilo baseado em dados com conjuntos de dados.

É possível personalizar o estilo, adicionar manipuladores de eventos para alterar o estilo dinamicamente e muito mais usando a API Maps JS. Confira exemplos nos documentos. Abaixo, definiremos uma função setStyle para criar o estilo de elemento de ponto e linha para este exemplo com base no atributo “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,
           }
     }
}

Observação: sempre adicione a atribuição do conjunto de dados ao app de mapa. Para adicionar a atribuição OSM, siga o exemplo de código de atribuição nos documentos seguindo as diretrizes de OSM.

O código acima, quando inicializado em um aplicativo da web de página única, gera o seguinte visual de dados do mapa:

mapa ferroviário de Londres

A partir daqui, você pode estender a visualização do mapa na função setStyle() adicionando lógica para filtrar elementos, adicionar estilo com base na interação do usuário e interagir com o restante do aplicativo.

Conclusão

Neste artigo, discutimos uma arquitetura de referência e um exemplo de implementação de um grande aplicativo de visualização de dados usando o Google Cloud e a Plataforma Google Maps. Com esta arquitetura de referência, é possível criar aplicativos de visualização de dados de local a partir de qualquer dado no BigQuery do GCP que tenham desempenho em qualquer dispositivo usando a API Datasets do Google Maps.

Próximas ações

Para saber mais:

Colaboradores

Autores principais:

  • Ryan Baumann, gerente de engenharia de soluções da Plataforma Google Maps