diff --git a/radon/radon-leaflet-raster.html b/radon/radon-leaflet-raster.html
new file mode 100644
index 0000000..14dd9ca
--- /dev/null
+++ b/radon/radon-leaflet-raster.html
@@ -0,0 +1,30 @@
+
+
+ PMTiles Leaflet Example
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/radon/radon-leaflet.html b/radon/radon-leaflet-vector.html
similarity index 95%
rename from radon/radon-leaflet.html
rename to radon/radon-leaflet-vector.html
index a5ea85b..fa2fe9c 100644
--- a/radon/radon-leaflet.html
+++ b/radon/radon-leaflet-vector.html
@@ -19,7 +19,7 @@
const p = new pmtiles.PMTiles("radon_v2.pmtiles")
p.getHeader().then(h => {
- let layer = pmtiles.leafletRasterLayer(p, {
+ let layer = pmtiles.leafletVectorLayer(p, {
maxzoom:h.maxZoom,
attribution:'Map tiles by Stamen Design, under CC BY 3.0. Data by OpenStreetMap, under ODbL.'
});
diff --git a/radon/radon-maplibre.html b/radon/radon-maplibre.html
index 76600d1..a85361c 100644
--- a/radon/radon-maplibre.html
+++ b/radon/radon-maplibre.html
@@ -21,18 +21,18 @@
let protocol = new pmtiles.Protocol();
maplibregl.addProtocol("pmtiles",protocol.tile);
- let PMTILES_URL = "https://protomaps.github.io/PMTiles/protomaps(vector)ODbL_firenze.pmtiles";
+ let PMTILES_URL = "https://britishgeologicalsurvey.github.io/sensor-things-api-demo/web-maps/radon_v2.pmtiles";
const p = new pmtiles.PMTiles(PMTILES_URL);
// this is so we share one instance across the JS code and the map renderer
protocol.add(p);
-
+
// 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({
container: 'map',
- zoom: h.maxZoom-2,
+ zoom: h.maxZoom-6,
center: [h.centerLon, h.centerLat],
style: {
version:8,
@@ -45,37 +45,21 @@
},
layers: [
{
- "id":"buildings",
+ "id":"Radon_Indicative_Atlas_v3",
"source": "example_source",
- "source-layer":"landuse",
+ "source-layer":"Radon_Indicative_Atlas_v3",
"type": "fill",
"paint": {
"fill-color": "steelblue"
}
- },
- {
- "id":"roads",
- "source": "example_source",
- "source-layer":"roads",
- "type": "line",
- "paint": {
- "line-color": "black"
- }
- },
- {
- "id":"mask",
- "source": "example_source",
- "source-layer":"mask",
- "type": "fill",
- "paint": {
- "fill-color": "white"
- }
}
]
}
});
map.showTileBoundaries = true;
})
+ // Add zoom and rotation controls to the map.
+ map.addControl(new maplibregl.NavigationControl());