tangrams / tangram

WebGL map rendering engine for creative cartography
https://tangram.city
MIT License
2.22k stars 290 forks source link

support PMTiles as a data source #776

Open burritojustice opened 3 years ago

burritojustice commented 3 years ago

Teach Tangram how to natively decipher 'serverless' PMTiles.

https://github.com/protomaps/PMTiles

"PMTiles is a single-file archive format for tiled data. A PMTiles archive can be hosted on a commodity storage platform such as S3, and enables low-cost, zero-maintenance map applications that are "serverless" - free of a custom tile backend or third party provider."

"PMTiles is a binary serialization format designed for two main access patterns: over the network, via HTTP 1.1 Byte Serving (Range: requests), or via memory-mapped files on disk."

via https://protomaps.com/blog/dynamic-maps-static-storage/

1. Fetch the first 512 kilobytes and parse the directory into a lookup table
2. Look up by key of the tile you want, in this case 8_65_95
3. It's a match! You'll have a byte range offset: 785366 length: 21400
4. Fetch those bytes using Range:bytes=785366-806765 and interpret the data

200 line JS decoder library: https://github.com/protomaps/PMTiles/blob/master/js/index.mjs

Perhaps something like

sources:
    mapzen:
        type: PMTiles
        url: https://mydata.com/map.pmtiles

though this does not give an indication of the tile type, which would likely be pbf or png given the environment.

bdon commented 3 years ago

+1

From what I can tell https://github.com/protomaps/PMTiles needs to be brought in as a dependency, because Tangram does not expose an API to extend sources at runtime, it's a small bit of code but fast moving at the moment.