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

Визуализация данных с помощью BigQuery

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

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

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

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

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

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

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

схема архитектуры

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

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

Требования

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

Шаг 1. Запросите данные в BigQuery

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

Используйте Cloud Shell или консоль BigQuery Cloud, чтобы отправить запрос к таблице с помощью SQL. В приведенном ниже фрагменте кода используется команда bq query, которая запрашивает все железные дороги, отфильтрованные по Лондону с помощью граничной рамки и функции 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 Карт на основе результатов запроса в Google Cloud Storage (GCS). С помощью Datasets API можно создать набор данных, а затем загрузить в него данные из файла, размещенного в GCS.

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

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

Предварительный просмотр набора данных

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

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

Шаг 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,
           }
     }
}

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

карта железных дорог лондона

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

Заключение

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

Дальнейшие действия

Что ещё почитать:

Авторы

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

Райан Бауманн (Ryan Baumann), менеджер по разработке решений для платформы Google Карт