styles updates for v4.1.0 (#80)

basemaps/maplibre.md

@@ -29,7 +29,7 @@ You can view a list of available fonts [in the GitHub repository](https://github
 The `sprite` key references a URL specific to one of [the default themes](/basemaps/themes):
 
 ```js
-sprite: "https://protomaps.github.io/basemaps-assets/sprites/v3/light"
+sprite: "https://protomaps.github.io/basemaps-assets/sprites/v4/light"
 ```
 
 These are required for townspots, highway shields and point of interest icons.
@@ -56,7 +56,7 @@ import layers from 'protomaps-themes-base';
 style: {
     version: 8,
     glyphs:'https://protomaps.github.io/basemaps-assets/fonts/{fontstack}/{range}.pbf',
-    sprite: "https://protomaps.github.io/basemaps-assets/sprites/v3/light",
+    sprite: "https://protomaps.github.io/basemaps-assets/sprites/v4/light",
     sources: {
         "protomaps": {
             type: "vector",

basemaps/themes.md

@@ -15,30 +15,30 @@ These examples use the preferred [MapLibre GL JS](/basemaps/maplibre) library.
 
 ### light
 
-A general-purpose basemap style.
+A general-purpose basemap style with icons.
 
-<MaplibreMap theme="light"/>
+<MaplibreMap theme="light" :zoom=13 :lat="51.509" :lng="-0.14"/>
 
 ### dark
 
-A general-purpose basemap style.
+A general-purpose basemap style with icons.
 
-<MaplibreMap theme="dark"/>
+<MaplibreMap theme="dark" :zoom=13 :lat="51.509" :lng="-0.14"/>
 
 ### white
 
 A style for data visualization.
 
-<MaplibreMap theme="white"/>
+<MaplibreMap theme="white" :zoom=13 :lat="51.509" :lng="-0.14"/>
 
 ### grayscale
 
 A style for data visualization.
 
-<MaplibreMap theme="grayscale"/>
+<MaplibreMap theme="grayscale" :zoom=13 :lat="51.509" :lng="-0.14"/>
 
 ### black
 
 A style for data visualization.
 
-<MaplibreMap theme="black"/>
+<MaplibreMap theme="black" :zoom=13 :lat="51.509" :lng="-0.14"/>

components/MaplibreMap.vue

@@ -77,7 +77,7 @@ const style = (passedTheme?: string, highlightLayer?: string) => {
     version: 8,
     glyphs:
       "https://protomaps.github.io/basemaps-assets/fonts/{fontstack}/{range}.pbf",
-    sprite: `https://protomaps.github.io/basemaps-assets/sprites/v3/${theme}`,
+    sprite: `https://protomaps.github.io/basemaps-assets/sprites/v4/${theme}`,
     sources: {
       protomaps: {
         type: "vector",

guide/security-privacy.md

@@ -110,7 +110,7 @@ Below is a complete example of a map application that avoids third-party data pr
               center: [11.24962,43.77078],
               style: {
                 glyphs: "fonts/{fontstack}/{range}.pbf",
-                sprite: "sprites/v3/light",
+                sprite: "sprites/v4/light",
                 version: 8,
                 sources: {
                   protomaps: {

package.json

@@ -9,7 +9,7 @@
   "dependencies": {
     "maplibre-gl": "^4.7.1",
     "pmtiles": "^3.2.0",
-    "protomaps-themes-base": "4.0.1",
+    "protomaps-themes-base": "4.1.0",
     "vitepress": "^1.0.0-rc.15"
   },
   "devDependencies": {