tom/personal_site
1
0
Fork 0
mirror of https://github.com/TomHodson/tomhodson.github.com.git synced 2025-06-26 10:01:18 +02:00
Code Issues Packages Projects Releases Wiki Activity

Use locally hosted maplibre

Browse Source
This commit is contained in:
Tom 2023-10-31 15:44:43 +00:00
parent fec73b85b5
commit af307f7edf
4 changed files with 1625 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
_posts/2023-10-30-maps-3.md
View File

@ -7,9 +7,10 @@ excerpt: |
image: image:
thumbnail: thumbnail:
head: | head: |
<link rel="stylesheet" href="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.css" crossorigin="anonymous"> <link rel="prefetch" href="/assets/blog/pmtiles/light.json" as="fetch">
<script src="https://unpkg.com/maplibre-gl@3.3.1/dist/maplibre-gl.js" crossorigin="anonymous"></script> <link rel="stylesheet" href="/assets/css/maplibre-gl.css">
<script src="https://unpkg.com/pmtiles@2.11.0/dist/index.js"></script> <script src="/assets/js/maplibre-gl.js"></script>
<script src="/assets/js/pmtiles.js"></script>
--- ---
PMTiles is a new project that lets you serve vector map data from static files through the magic of HTTP range requests. PMTiles is a new project that lets you serve vector map data from static files through the magic of HTTP range requests.
@ -35,7 +36,7 @@ By following this [blog post][blog] and throwing in a bit of code from [the offi
let isDark = (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) let isDark = (window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches)
async function getLayers(isDark) { async function getLayers(isDark) {
let style_name = isDark ? "/dark.json" : "/light.json"; let style_name = isDark ? "dark.json" : "light.json";
const base = '{{"/assets/blog/pmtiles/" | relative_url}}'; const base = '{{"/assets/blog/pmtiles/" | relative_url}}';
let resp = await fetch(base + style_name); let resp = await fetch(base + style_name);
let layers = await resp.json(); let layers = await resp.json();

1
assets/css/maplibre-gl.css Normal file
View File

File diff suppressed because one or more lines are too long

48
assets/js/maplibre-gl.js Normal file
View File

File diff suppressed because one or more lines are too long

1571
assets/js/pmtiles.js Normal file
View File

File diff suppressed because it is too large Load Diff