Эта страница переведена с помощью Cloud Translation API.

Визуализируйте свои данные с помощью BigQuery и Datasets API

В этом документе представлена эталонная архитектура и пример создания визуализаций картографических данных с данными о местоположении в Google Cloud Platform BigQuery и API наборов данных платформы Google Maps , таких как анализ открытых муниципальных данных, создание карты покрытия телекоммуникаций или визуализация следов движения парка мобильных транспортных средств.

Визуализация картографических данных — мощный инструмент для привлечения пользователей и раскрытия пространственной информации о данных о местоположении. Данные о местоположении — это данные, которые имеют точечные, линейные или полигональные объекты. Например, карты погоды помогают потребителям понимать и планировать поездки, а также готовиться к штормам; Карты бизнес-аналитики помогают пользователям извлечь ценную информацию из анализа данных, а карты телекоммуникаций помогают пользователям понять зону покрытия и качество своих провайдеров в определенной зоне обслуживания.

Однако разработчикам приложений сложно создавать большие визуализации картографических данных, которые были бы производительными и удобными для пользователя. Большие данные необходимо загружать в память на стороне клиента, что приводит к медленной загрузке первой карты. Визуализация должна работать на всех устройствах, включая недорогие мобильные телефоны с ограничениями по памяти и графическому процессору. Наконец, разработчикам необходимо выбрать большую библиотеку рендеринга данных, которая является портативной, надежной и производительной при работе с большими данными.

Эталонная архитектура

Разработка приложений с визуализацией больших данных требует двух основных компонентов.

Серверная часть клиента — все данные и услуги серверных приложений, такие как обработка и хранение.
Клиентский клиент — пользовательский интерфейс вашего приложения с компонентом визуализации карты.

Ниже представлена системная диаграмма того, как эти два компонента взаимодействуют с пользователем приложения, Google Cloud и платформой Google Maps для создания большого приложения для визуализации данных.

architecture diagram

Пример — железные дороги в Лондоне.

В этом примере мы применим эталонную архитектуру для создания веб-приложения с GCP и Google Maps, которое визуализирует все железные дороги Лондона на основе данных Open Street Map (OSM).

Предварительные условия

Доступ к тестовой среде BigQuery и облачной консоли
Убедитесь, что у вас есть проект GCP и настроен платежный аккаунт.

Шаг 1. Запрос данных в BigQuery

Перейдите к общедоступным наборам данных BigQuery . Набор данных bigquery-public-data и таблица geo_openstreetmap.planet_features содержат все данные Open Street Map (OSM) со всего земного шара, включая все возможные объекты. Откройте для себя все доступные функции для запроса в OSM Wiki, включая amenity , road и landuse .

Используйте Cloud Shell или BigQuery Cloud Console ( https://console.cloud.google.com ), чтобы запросить таблицу с помощью SQL. В приведенном ниже фрагменте кода используется команда запроса bq для запроса всех железных дорог, отфильтрованных только до Лондона, с использованием ограничивающего прямоугольника и функции ST_Intersects() .

Чтобы выполнить этот запрос из Cloud Shell, запустите следующий фрагмент кода, обновив идентификатор проекта, набор данных и имя таблицы для вашей среды.

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

Запрос возвращает:

уникальный идентификатор для каждой функции osm_id
feature_type например, точки, линии и т. д.
name объекта, например, Paddington Station
Тип railway , например, главная, туристическая, военная и т. д.
wkt объекта — геометрия точки, линии или полигона в формате WKT. WKT – это стандартный формат данных, возвращаемый столбцами BigQuery Geography в запросе.

Примечание. Чтобы визуально проверить результаты запроса перед созданием набора данных, вы можете быстро визуализировать свои данные на информационной панели BigQuery с помощью Looker Studio .

Чтобы экспортировать таблицу в CSV-файл в сегменте Google Cloud Storage, используйте команду bq Extract в Cloud Shell:

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

Примечание. Вы можете автоматизировать каждый шаг с помощью Cloud Scheduler, чтобы регулярно обновлять данные.

Шаг 2. Создайте набор данных из файла CSV.

Затем создайте набор данных платформы Google Maps на основе результатов запроса в Google Cloud Storage (GCS). Используя API наборов данных , вы можете создать набор данных , а затем загрузить в него данные из файла, размещенного на GCS.

Для начала включите API наборов данных Карт в своем проекте GCP и просмотрите документацию по API . Существуют клиентские библиотеки Python и Node.js для вызова API наборов данных из логики в серверной части вашего приложения. Кроме того, существует графический интерфейс наборов данных для создания наборов данных вручную в Cloud Console.

После завершения загрузки набора данных вы можете просмотреть свой набор данных в графическом интерфейсе наборов данных.

Dataset preview

Шаг 4. Свяжите свой набор данных с идентификатором карты.

После создания набора данных вы можете создать идентификатор карты со связанным стилем карты. В редакторе стилей карты вы можете связать идентификатор карты и стиль с набором данных. Здесь вы также можете применить стили карты на основе облака, чтобы настроить внешний вид вашей карты.

Шаг 5. Создайте визуализацию карты клиентского приложения.

Наконец, вы можете добавить набор данных в клиентское приложение визуализации данных с помощью Maps JS API . Инициализируйте объект карты, используя идентификатор карты, связанный с вашим набором данных из предыдущего шага. Затем установите стиль и интерактивность слоя набора данных. Для получения более подробной информации ознакомьтесь с полным руководством по стилизации на основе данных с помощью наборов данных .

Вы можете настроить стиль, добавить обработчики событий для динамического изменения стиля и многое другое с помощью Maps JS API. См. примеры в документации . Ниже мы определим функцию setStyle для создания стиля точечного и линейного объекта для этого примера на основе атрибута «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,
           }
     }
}

Примечание. Обязательно всегда добавляйте атрибуцию вашего набора данных в картографическое приложение. Чтобы добавить атрибуцию OSM, следуйте примеру кода атрибуции в документации, соответствующей рекомендациям OSM .

Этот код выше при инициализации в одностраничном веб-приложении дает следующий визуальный элемент данных карты:

london railway map

Отсюда вы можете расширить визуализацию карты с помощью функции setStyle(), добавив логику к функциям фильтрации, добавив стили на основе взаимодействия с пользователем и взаимодействуя с остальной частью вашего приложения.

Заключение

В этой статье мы обсудили эталонную архитектуру и пример реализации приложения для визуализации больших данных с использованием Google Cloud и платформы Google Maps. Используя эту эталонную архитектуру, вы можете создавать приложения для визуализации данных о местоположении на основе любых данных в GCP BigQuery, которые будут работать на любом устройстве с помощью API наборов данных Google Maps.

Следующие действия

Дальнейшее чтение:

Авторы

Основные авторы:

Райан Бауманн , инженер-менеджер по платформенным решениям Google Maps