如何在谷歌地图上显示自定义矢量图块



目标是在谷歌地图上显示大量数据。我所说的大量是指存储在PostgreSQL数据库中的大约1000万个段。路段表示道路的某些特征,因此路段应覆盖底图中的道路。段属性可能会随时间而更改。

此问题的最佳技术解决方案是使用自定义磁贴服务器(如果错误,请更正(。

根据Google Maps JS API,我发现了两种使用自定义图块服务器在地图上绘制的方法:

  • 使用 GeoJson/KML 数据 (https://developers.google.com/maps/documentation/javascript/datalayer#load_geojson(
  • 使用 PNG 图像 (https://developers.google.com/maps/documentation/javascript/maptypes#ImageMapTypes(

我都试过了。第一个不符合我的需求,因为 GeoJson 看起来太大,导致性能问题。从UX的角度来看,第二个是不好的,因为它使用光栅瓦片,而现在我们应该使用矢量瓦片。我也看了OpenLayers/Leaflet,但没有找到使用谷歌地图的官方方式(见 https://github.com/mapbox/mapbox-gl-js/issues/1791(。

这里的关键是使用矢量图块,但是我无法在谷歌地图上渲染矢量图块(MVT(。

有什么方法可以在谷歌地图平台上渲染矢量图块吗?

我已经联系了谷歌地图平台的支持,他们建议我使用 deck.gl。

它是一种在地图上显示大量数据集的技术,包括谷歌地图。它使用官方的谷歌地图API进行渲染,尤其是OverlayView

这里有一篇关于谷歌地图和 deck.gl 的很好的博客文章: https://cloud.google.com/blog/products/maps-platform/high-performance-data-visualizations-google-maps-platform-and-deckgl

我已经设法使用角度在谷歌地图上显示自定义矢量图块,这是示例存储库: https://github.com/yterletskyi/deckgl-angular

顺便说一句,感谢路易斯·塔瓦雷斯关于 https://github.com/landtechnologies/Mapbox-vector-tiles-basic-js-renderer 库的解决方案,它也依赖于OverlayView。我没有尝试过,但方法与 deck.gl 相同,因此应该没有任何问题。

上级:

在尝试了 deck.gl 之后,问题转向在移动iOS和Android平台上实现这一点。经过一些研究,我联系了Google支持,但不幸的是,似乎没有解决方案。谷歌支持报价:

你好尤拉,

遗憾的是,无法使用移动 API 渲染矢量图块。我也没有关于允许您使用Google Maps API执行此操作的服务的建议。

对不起,

检查此库以在谷歌地图中加载矢量图块: https://github.com/techjb/Vector-Tiles-Google-Maps

你只需要创建一个mbtiles文件,然后上传到Mapbox或其他服务器,最后连接到谷歌地图。

相关内容

  • 没有找到相关文章

最新更新