mirrors/PMTiles
1
0
Fork 0
mirror of https://github.com/protomaps/PMTiles.git synced 2026-02-04 02:41:09 +00:00
Code Issues Packages Projects Releases Wiki Activity

rename maplibre_headers to maplibre_advanced; show metadata description (#506)

Browse Source
This commit is contained in:
Brandon Liu
2025-01-06 15:04:07 +08:00
committed by GitHub
parent 9a53ed8495
commit 275b5bcb5d
1 changed files with 7 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
js/examples/maplibre_headers.html → js/examples/maplibre_advanced.html
View File

@@ -10,12 +10,14 @@
margin: 0;
}
#map {
height:100%; width:100%;
height:calc(100% - 50px);
width:100%;
}
</style>
</head>
<body>
<div id="map"></div>
Description from PMTiles metadata: <span id="description"></span>
<script type="text/javascript">
// Advanced MapLibre example demonstrating PMTiles JavaScript API + pmtiles:// protocol.
@@ -31,6 +33,10 @@
// this is so we share one instance across the JS code and the map renderer
protocol.add(p);
p.getMetadata().then((m) => {
document.getElementById("description").textContent = m.description;
})
// we first fetch the header so we can get the center lon, lat of the map.
p.getHeader().then((h) => {
const map = new maplibregl.Map({