本文档提供了一个参考架构和示例,介绍如何在 Google Cloud Platform BigQuery 和 Google Maps Platform Datasets API 中使用位置数据直观呈现地图数据,例如分析开放的市政数据、创建电信覆盖范围地图,或直观呈现移动车队移动轨迹。
地图数据可视化是一款强大的工具,有助于吸引用户并从位置数据中获得空间分析。位置数据是指包含点、线或多边形地图项的数据。例如,气象图可帮助消费者了解和规划行程,以及应对风暴;商业智能地图有助于用户通过数据分析获得洞见,而电信地图可帮助用户了解提供商在指定服务区域内的覆盖范围和质量。
然而,应用开发者很难实现高性能的大型地图数据可视化,从而提供出色的用户体验。大量数据必须加载到内存客户端,导致首次地图加载速度变慢。在所有设备(包括内存和 GPU 有限制的低端手机)上都必须具有出色的视觉效果。最后,开发者需要选择一个可移植、可靠且性能出色的大型数据渲染库。
参考架构
开发具有大数据可视化效果的应用需要两个主要组件。
- 客户后端 - 所有后端应用数据和服务,例如处理和存储。
- 客户客户端 - 包含地图可视化组件的应用界面。
下面的系统图展示了这两个组件如何与应用用户、Google Cloud 和 Google Maps Platform 交互以创建大型数据可视化应用。
⭐ 注意:Maps Datasets API 是正式发布前的产品。如需了解详情,请参阅服务条款。
设计注意事项
使用 Google Cloud 和 Google Maps Platform 创建高性能数据可视化时,需要遵循一些设计注意事项。
- 源数据大小和更新频率。
- 如果 GeoJSON 格式的源数据小于 5MB 或者更新非常频繁(例如实时天气雷达预报),可以考虑在应用中以 GeoJSON 对象客户端的形式提供数据,并使用 deck.gl 图层进行渲染。
- 如果数据大小超过 5MB,并且每小时更新速度不超过一次,请考虑使用本文档中的 Datasets API 架构。
- 数据集支持的文件大小上限为 350 MB。
- 如果数据大于 350 MB,请考虑先剪除或简化源文件中的几何图形数据,然后再传递到数据集(请参阅下文中的“数据剪枝”)。
- 架构和格式
- 请确保您的数据具有每项地图项的全局唯一 ID 属性。通过唯一 ID,您可以选择特定地图项并为其设置样式,也可以将数据与地图项联接以便直观呈现,例如,针对“点击”用户事件设置选定地图项的样式。
- 根据 Datasets API 规范,将数据设置为 CSV 或 GeoJSON 格式,并提供有效的列名称、数据类型和 GeoJSON 对象类型。
- 为了轻松从 BigQuery 创建数据集,请在 SQL CSV 导出文件中创建名为
wkt
的列。数据集支持从名为wkt
的列以已知文本 (WKT) 格式从 CSV 导入几何图形。 - 检查您的数据是否为有效的几何图形和数据类型。例如,GeoJSON 必须采用 WGS84 坐标系,几何图形环绕顺序,等等。
- 可以使用 geojson-validate 等工具确保源文件中的所有几何图形均有效;使用 ogr2ogr 转换源文件的格式或坐标系。
- 数据剪除
- 尽量减少地图项的属性数量。您可以在运行时通过唯一标识符键将其他属性与功能联接(示例)。
- 尽可能对属性对象使用整数数据类型,以最大限度减少功能块存储空间,确保功能块在客户端应用中通过 HTTPS 加载时性能出色。
- 简化和/或聚合非常复杂的地图项几何图形;考虑对复杂的多边形几何图形使用 ST_Simplify 等 BigQuery 函数,以缩减源文件大小并提高地图性能。
- 平铺
- Google Maps Datasets API 会根据您的源数据文件创建地图图块,以便在 Maps JS API 中使用。
- 地图图块是一种基于缩放的索引系统,可让您以更高效的方式将数据加载到可视化应用中。
- 在较低的缩放级别,地图图块可能会掉落密集或复杂的地图项。当用户缩小到某个州或国家/地区时(例如,z5-z12)可能与放大到城市或社区(例如,z13-z18)时看起来有所不同。
示例 - 伦敦的铁路
在本例中,我们将应用参考架构创建一个包含 GCP 和 Google 地图的 Web 应用,该应用可根据 Open Street Map (OSM) 数据直观呈现伦敦的所有铁路。
前提条件
- 能够访问 BigQuery Sandbox 和 Cloud 控制台
- 确保您拥有 GCP 项目和结算帐号设置。
第 1 步 - 在 BigQuery 中查询数据
前往 BigQuery 公共数据集。数据集“bigquery-public-data”和表 geo_openstreetmap.planet_features
包含全球的开放街景地图 (OSM) 数据,包括所有可能的特征。探索 OSM Wiki 中可供查询的所有可用功能,包括 amenity
、road
和 landuse
。
使用 Cloud Shell 或 BigQuery Cloud 控制台(https://console.cloud.google.com) 通过 SQL 查询表。下面的代码段使用了 bq query 命令,通过使用边界框和 ST_Intersects() 函数,查询过滤为仅包含伦敦的所有铁路。
如需从 Cloud Shell 执行此查询,请运行以下代码片段,更新您的环境的项目 ID、数据集和表名称。
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
类型,例如 main、tourism、军事等- 地图项的
wkt
,即点、线或多边形几何图形,采用 WKT 格式。WKT 是 BigQuery 地理位置列在查询中返回的标准数据格式。
注意 - 如需在创建数据集之前直观地验证查询结果,您可以使用 Looker Studio 在 BigQuery 的信息中心内快速直观呈现数据。
如需将表导出到 Google Cloud Storage 存储分区中的 CSV 文件,请在 Cloud Shell 中使用 bq extract 命令:
bq extract \
--destination_format "CSV" \
--field_delimiter "," \
--print_header=true \
PROJECTID:DATASET.TABLENAME \
gs://BUCKET/FILENAME.csv
注意:您可以使用 Cloud Scheduler 自动执行每个步骤,定期更新数据。
第 2 步 - 从 CSV 文件创建数据集
接下来,根据 Google Cloud Storage (GCS) 上的查询输出创建 Google Maps Platform 数据集。借助 Datasets API,您可以创建数据集,然后从 GCS 上托管的文件将数据上传到您的数据集。
首先,请在您的 GCP 项目中启用 Maps Datasets API,并查看 API 文档。有 Python 和 Node.js 客户端库,可用于从应用后端的逻辑调用 Datasets API。此外,我们还提供了一个数据集 GUI,用于在 Cloud 控制台中手动创建数据集。
数据集上传完成后,您可以在数据集 GUI 中预览数据集。
第 4 步 - 将数据集与地图 ID 相关联
创建数据集后,您可以使用关联的地图样式创建地图 ID。在地图样式编辑器中,您可以将地图 ID 和样式与数据集相关联。您还可以在此处应用云端地图样式设置,自定义地图的外观和风格。
第 5 步 - 创建客户端应用地图可视化图表
最后,您可以使用 Maps JS API 将数据集添加到客户端数据可视化应用中。使用上一步中的数据集关联的 mapID 初始化地图对象。然后,设置数据集图层的样式和互动性。如需了解详情,请参阅使用数据集设置数据驱动型样式的完整指南。
您可以使用 Maps JS API 自定义样式,添加事件处理脚本来动态更改样式,以及执行其他操作。如需查看示例,请参阅docs。下面我们将定义一个 setStyle 函数,用于基于属性“feature_type”为此示例创建点和线条地图项样式。
注意 - 请务必使用 v=beta 渠道来实现 Maps JS API。
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 指南遵循文档中的归因代码示例。
上述代码在单页 Web 应用中初始化时会生成以下地图数据视觉元素:
在这里,您可以通过添加逻辑来过滤地图项、添加基于用户互动的样式,并与应用的其余部分进行互动,从而在 setStyle() 函数中扩展地图可视化功能。
总结
在本文中,我们讨论了使用 Google Cloud 和 Google Maps Platform 的大型数据可视化应用的参考架构和实现示例。借助此参考架构,您可以使用 Google Maps Datasets API,基于 GCP BigQuery 中的任何数据创建可在任何设备上高效运行的位置数据可视化应用。
后续操作
深入阅读:
- Google Maps Platform Datasets API 文档
- 使用数据云端硬盘样式实时查看数据
- BigQuery 中的地理空间分析简介
- 在 BigQuery 中使用 GeoJSON 进行地理空间分析
贡献者
主要作者:
- Ryan Baumann,Google Maps Platform 解决方案工程经理