diff --git a/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte b/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte index c673145c..6f4986df 100644 --- a/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte +++ b/components/src/maplibre/MapStyle/SWRDataLabDark.stories.svelte @@ -30,7 +30,28 @@ - + + +
+
+ + + +
+
+
+
+ +
diff --git a/components/src/maplibre/MapStyle/SWRDataLabDark.ts b/components/src/maplibre/MapStyle/SWRDataLabDark.ts index e6fa0a14..65299393 100644 --- a/components/src/maplibre/MapStyle/SWRDataLabDark.ts +++ b/components/src/maplibre/MapStyle/SWRDataLabDark.ts @@ -1,5 +1,8 @@ +import type { StyleOptions } from './types'; import type { StyleSpecification } from 'maplibre-gl'; +import defaultOptions from './defaultOptions'; + import makeAdmin from './components/Admin'; import makeBuildings from './components/Buildings'; import makeLanduse from './components/Landuse'; @@ -7,7 +10,6 @@ import makeTransit from './components/Transit'; import makePlaceLabels from './components/PlaceLabels'; import makeWalking from './components/Walking'; import makeRoads from './components/Roads'; -import type { StyleOptions } from './types'; const tokens = { sans_regular: ['SWR Sans Regular'], @@ -56,10 +58,7 @@ interface styleFunction { const style: styleFunction = (opts) => { const options = { - enableBuildingExtrusions: false, - roads: { - showLabels: true - }, + ...defaultOptions, ...opts } as StyleOptions; @@ -133,7 +132,9 @@ const style: styleFunction = (opts) => { ...(options.enableBuildingExtrusions ? [buildingExtrusions] : []), // 8. Point labels - ...placeLabels, + ...(options.places?.showLabels ? placeLabels : []), + + // 9. Admin boundary labels ...boundaryLabels ] }; diff --git a/components/src/maplibre/MapStyle/SWRDataLabLight.mdx b/components/src/maplibre/MapStyle/SWRDataLabLight.mdx index 4c66b524..8573e625 100644 --- a/components/src/maplibre/MapStyle/SWRDataLabLight.mdx +++ b/components/src/maplibre/MapStyle/SWRDataLabLight.mdx @@ -81,17 +81,19 @@ Call `SWRDataLabLight()` to construct a style document and pass the result to th ```ts interface StyleOptions { - enableBuildingExtrusions?: boolean; - roads?: { - showLabels?: boolean - } - + enableBuildingExtrusions?: boolean; + roads?: { + showLabels?: boolean + } + places?: { + showLabels?: boolean + } } ``` ## Icons -export const customIcons = ['pin-14']; +export const customIcons = ['pin-14', 'pin-14-dark']; export const osmicIconsCount = Object.entries(SpriteData).filter((row) => { return !customIcons.includes(row[0]); }).length; diff --git a/components/src/maplibre/MapStyle/SWRDataLabLight.ts b/components/src/maplibre/MapStyle/SWRDataLabLight.ts index 5f4254cd..1ee518c3 100644 --- a/components/src/maplibre/MapStyle/SWRDataLabLight.ts +++ b/components/src/maplibre/MapStyle/SWRDataLabLight.ts @@ -1,3 +1,4 @@ +import type { StyleOptions } from './types'; import type { StyleSpecification } from 'maplibre-gl'; import makeAdmin from './components/Admin'; @@ -7,7 +8,7 @@ import makeTransit from './components/Transit'; import makePlaceLabels from './components/PlaceLabels'; import makeWalking from './components/Walking'; import makeRoads from './components/Roads'; -import type { StyleOptions } from './types'; +import defaultOptions from './defaultOptions'; const tokens = { sans_regular: ['SWR Sans Regular'], @@ -56,7 +57,7 @@ interface styleFunction { const style: styleFunction = (opts) => { const options = { - enableBuildingExtrusions: false, + ...defaultOptions, ...opts } as StyleOptions; @@ -130,7 +131,9 @@ const style: styleFunction = (opts) => { ...(options.enableBuildingExtrusions ? [buildingExtrusions] : []), // 8. Point labels - ...placeLabels, + ...(options.places?.showLabels ? placeLabels : []), + + // 9. Admin boundary labels ...boundaryLabels ] }; diff --git a/components/src/maplibre/MapStyle/defaultOptions.ts b/components/src/maplibre/MapStyle/defaultOptions.ts new file mode 100644 index 00000000..57ae17b7 --- /dev/null +++ b/components/src/maplibre/MapStyle/defaultOptions.ts @@ -0,0 +1,13 @@ +import type { StyleOptions } from './types'; + +const opts: StyleOptions = { + enableBuildingExtrusions: false, + places: { + showLabels: true + }, + roads: { + showLabels: true + } +}; + +export default opts; diff --git a/components/src/maplibre/MapStyle/types.ts b/components/src/maplibre/MapStyle/types.ts index 34038225..09a945a1 100644 --- a/components/src/maplibre/MapStyle/types.ts +++ b/components/src/maplibre/MapStyle/types.ts @@ -1,5 +1,8 @@ interface StyleOptions { enableBuildingExtrusions?: boolean; + places?: { + showLabels?: boolean; + }; roads?: { showLabels?: boolean; }; diff --git a/components/src/maplibre/Maplibre.mdx b/components/src/maplibre/Maplibre.mdx index c9a4cf3e..5ddef431 100644 --- a/components/src/maplibre/Maplibre.mdx +++ b/components/src/maplibre/Maplibre.mdx @@ -64,6 +64,7 @@ This example initialises a map using the SWRDataLabLight style, adds an addition - **[VectorTileSource](?path=/docs/maplibre-source-vectortilesource--docs)**: Loads vector tile data supplied by a tileserver - **[GeoJSONSource](?path=/docs/maplibre-source-geojsonsource--docs)**: Loads a vector data from a GeoJSON object or remote file +- **[ArrowSource](?path=/docs/maplibre-source-arrowsource--docs)**: Provides vector data for quadratic bezier arrows ### Layers