How to view pmtiles locally?

[Robinlovelace]

I've got a local test version of a pmtiles file and am trying to view it in our statically hosted web app on localhost.

This is the change I've made:

But the tiles are not showing. Any advice greatly appreciated, cc @mem48 who wrote most of the .js code.

Source: https://github.com/nptscot/nptscot.github.io/pull/76/files

[Robinlovelace]

Solution:

    	'url': 'pmtiles://rnet_2023-08-11.pmtiles',

[bdon]

That looks correct if rnett_2023-08-11.pmtiles lives next to the page that's loading the style, but may not work if you want to load the style on a page with a different path...

An absolute path that starts with / may work in that case

[jaguardo]

I've tried this many different ways for locally stored pmtile files (using jsx/react) and keep getting a Error: Wrong magic number for PMTiles archive is there something subtle that could be missing?

[bdon]

It depends on what build system or local HTTP server you're using, you should put it in the public/ folder like any other static assets.

[jaguardo]

I tried putting it in the public folder, in fact i think i updated the sandbox. It is just a react dev atm using 'yarn start' but it is pretty repeatable so far... but yarn/react doesn't serve files like a traditional http server.

[jaguardo]

[bdon]

your issue is specific to code sandbox, please verify that things uploaded to CSB public/ support HTTP 1.1 byte serving

[jaguardo]

Interesting... it suddenly started working on codesandbox this am (at least it seems hit or miss at times)... dont think I changed anything, so maybe the internal process that codesandbox uses for uploads took awhile to work through its process.

I did have to regress to earlier versions of some packages (maplibre-gl and react-map-gl) to get it to work locally, but have not trouble shot that any further.

[giswqs]

Here is a Python example for visualizing local PMTiles.
https://leafmap.org/notebooks/93_maplibre_pmtiles/#local-pmtiles