@swr-data-lab/components 2.33.1 → 2.34.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/maplibre/MapStyle/SWRDataLabDark.js +35 -10
  2. package/dist/maplibre/MapStyle/SWRDataLabLight.js +36 -11
  3. package/dist/maplibre/MapStyle/components/Hillshade.d.ts +1 -0
  4. package/dist/maplibre/MapStyle/components/Hillshade.js +43 -0
  5. package/dist/maplibre/MapStyle/storyLocations.d.ts +6 -0
  6. package/dist/maplibre/MapStyle/storyLocations.js +6 -0
  7. package/dist/maplibre/MapStyle/types.d.ts +1 -0
  8. package/package.json +1 -1
package/dist/maplibre/MapStyle/SWRDataLabDark.js CHANGED
@@ -6,6 +6,7 @@ import makeTransit from './components/Transit';
6
6
  import makePlaceLabels from './components/PlaceLabels';
7
7
  import makeWalking from './components/Walking';
8
8
  import makeRoads from './components/Roads';
9
+ import makeHillshade from './components/Hillshade';
9
10
  const tokens = {
10
11
  sans_regular: ['SWR Sans Regular'],
11
12
  sans_medium: ['SWR Sans Medium'],
@@ -36,7 +37,9 @@ const tokens = {
36
37
  boundary_state: 'hsl(218, 4%, 37%)',
37
38
  rail: 'hsl(0, 0%, 33%)',
38
39
  sand: 'hsl(0, 0%, 16%)',
39
- building: '#232325'
40
+ building: '#232325',
41
+ hillshade_light: 'hsla(0, 0%, 77%, 0.15)',
42
+ hillshade_dark: 'hsla(0, 0%, 0%, 0.65)'
40
43
  };
41
44
  const { landuse } = makeLanduse(tokens);
42
45
  const { placeLabels, boundaryLabels } = makePlaceLabels(tokens);
@@ -45,6 +48,7 @@ const { airports, transitBridges, transitSurface, transitTunnels } = makeTransit
45
48
  const { walkingLabels, walkingTunnels, walkingSurface, walkingBridges } = makeWalking(tokens);
46
49
  const { roadLabels, roadBridges, roadSurface, roadTunnels } = makeRoads(tokens);
47
50
  const { buildingFootprints, buildingExtrusions, structureExtrusions } = makeBuildings(tokens);
51
+ const { hillshade } = makeHillshade(tokens);
48
52
  const style = (opts) => {
49
53
  const options = {
50
54
  ...defaultOptions,
@@ -59,13 +63,32 @@ const style = (opts) => {
59
63
  sources: {
60
64
  'versatiles-osm': {
61
65
  attribution: '<a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> Mitwirkende',
62
- tiles: ['https://tiles.versatiles.org/tiles/osm/{z}/{x}/{y}'],
66
+ tiles: ['https://tiles.datenhub.net/tiles/osm/{z}/{x}/{y}'],
63
67
  bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
64
68
  type: 'vector',
65
69
  scheme: 'xyz',
66
70
  minzoom: 0,
67
71
  maxzoom: 14
68
72
  },
73
+ ...(options.enableHillshade && {
74
+ 'versatiles-hillshade': {
75
+ tilejson: '3.0.0',
76
+ name: 'VersaTiles Hillshade Vectors',
77
+ description: 'VersaTiles Hillshade Vectors based on Mapzen Jörð Terrain Tiles',
78
+ attribution: '<a href="https://github.com/tilezen/joerd/blob/master/docs/attribution.md">Mapzen Terrain Tiles, DEM Sources</a>',
79
+ version: '1.0.0',
80
+ tiles: ['https://tiles.datenhub.net/tiles/hillshade/{z}/{x}/{y}'],
81
+ type: 'vector',
82
+ scheme: 'xyz',
83
+ format: 'pbf',
84
+ bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
85
+ minzoom: 0,
86
+ maxzoom: 12,
87
+ vector_layers: [
88
+ { id: 'hillshade-vectors', fields: { shade: 'String' }, minzoom: 0, maxzoom: 12 }
89
+ ]
90
+ }
91
+ }),
69
92
  ...(options.enableBuildingExtrusions && {
70
93
  'basemap-de': {
71
94
  attribution: 'GeoBasis-DE',
@@ -91,28 +114,30 @@ const style = (opts) => {
91
114
  // 2. Building footprints + Structures (ie. bridges)
92
115
  ...(!options.enableBuildingExtrusions ? [buildingFootprints] : []),
93
116
  ...(options.enableBuildingExtrusions ? [structureExtrusions] : []),
94
- // 3. Tunnels
117
+ // 3. Shaded relief
118
+ ...(options.enableHillshade ? hillshade : []),
119
+ // 4. Tunnels
95
120
  ...walkingTunnels,
96
121
  ...roadTunnels,
97
122
  ...transitTunnels,
98
- // 4. Surface ways
123
+ // 5. Surface ways
99
124
  ...walkingSurface,
100
125
  ...roadSurface,
101
126
  ...transitSurface,
102
- // 5. Bridges ways
127
+ // 6. Bridges ways
103
128
  ...walkingBridges,
104
129
  ...roadBridges,
105
130
  ...transitBridges,
106
- // 6. Admin boundaries
131
+ // 7. Admin boundaries
107
132
  ...admin,
108
- // 7. Labels
133
+ // 8. Labels
109
134
  ...(options.roads?.showLabels ? walkingLabels : []),
110
135
  ...(options.roads?.showLabels ? roadLabels : []),
111
- // 8. Building extrusions
136
+ // 9. Building extrusions
112
137
  ...(options.enableBuildingExtrusions ? [buildingExtrusions] : []),
113
- // 8. Point labels
138
+ // 10. Point labels
114
139
  ...(options.places?.showLabels ? placeLabels : []),
115
- // 9. Admin boundary labels
140
+ // 11. Admin boundary labels
116
141
  ...boundaryLabels
117
142
  ]
118
143
  };
package/dist/maplibre/MapStyle/SWRDataLabLight.js CHANGED
@@ -6,13 +6,14 @@ import makePlaceLabels from './components/PlaceLabels';
6
6
  import makeWalking from './components/Walking';
7
7
  import makeRoads from './components/Roads';
8
8
  import defaultOptions from './defaultOptions';
9
+ import makeHillshade from './components/Hillshade';
9
10
  const tokens = {
10
11
  sans_regular: ['SWR Sans Regular'],
11
12
  sans_medium: ['SWR Sans Medium'],
12
13
  sans_bold: ['SWR Sans Bold'],
13
14
  background: {
14
15
  stops: [
15
- [8, 'hsl(24, 29%, 98.5%)'],
16
+ [8, 'hsl(24, 29%, 98%)'],
16
17
  [10, 'white']
17
18
  ]
18
19
  },
@@ -36,7 +37,9 @@ const tokens = {
36
37
  sand: 'hsl(60,0%,95%)',
37
38
  boundary_country: '#8b8a89',
38
39
  boundary_state: 'hsl(37, 10%, 75%)',
39
- boundary_country_case: 'white'
40
+ boundary_country_case: 'white',
41
+ hillshade_light: '#fff',
42
+ hillshade_dark: 'hsla(0, 0%, 53%, 0.15)'
40
43
  };
41
44
  const { landuse } = makeLanduse(tokens);
42
45
  const { placeLabels, boundaryLabels } = makePlaceLabels(tokens);
@@ -45,6 +48,7 @@ const { airports, transitBridges, transitSurface, transitTunnels } = makeTransit
45
48
  const { walkingLabels, walkingTunnels, walkingSurface, walkingBridges } = makeWalking(tokens);
46
49
  const { roadLabels, roadBridges, roadSurface, roadTunnels } = makeRoads(tokens);
47
50
  const { buildingFootprints, buildingExtrusions, structureExtrusions } = makeBuildings(tokens);
51
+ const { hillshade } = makeHillshade(tokens);
48
52
  const style = (opts) => {
49
53
  const options = {
50
54
  ...defaultOptions,
@@ -59,13 +63,32 @@ const style = (opts) => {
59
63
  sources: {
60
64
  'versatiles-osm': {
61
65
  attribution: '<a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> Mitwirkende',
62
- tiles: ['https://tiles.versatiles.org/tiles/osm/{z}/{x}/{y}'],
66
+ tiles: ['https://tiles.datenhub.net/tiles/osm/{z}/{x}/{y}'],
63
67
  bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
64
68
  type: 'vector',
65
69
  scheme: 'xyz',
66
70
  minzoom: 0,
67
71
  maxzoom: 14
68
72
  },
73
+ ...(options.enableHillshade && {
74
+ 'versatiles-hillshade': {
75
+ tilejson: '3.0.0',
76
+ name: 'VersaTiles Hillshade Vectors',
77
+ description: 'VersaTiles Hillshade Vectors based on Mapzen Jörð Terrain Tiles',
78
+ attribution: '<a href="https://github.com/tilezen/joerd/blob/master/docs/attribution.md">Mapzen Terrain Tiles, DEM Sources</a>',
79
+ version: '1.0.0',
80
+ tiles: ['https://tiles.datenhub.net/tiles/hillshade/{z}/{x}/{y}'],
81
+ type: 'vector',
82
+ scheme: 'xyz',
83
+ format: 'pbf',
84
+ bounds: [-180, -85.0511287798066, 180, 85.0511287798066],
85
+ minzoom: 0,
86
+ maxzoom: 12,
87
+ vector_layers: [
88
+ { id: 'hillshade-vectors', fields: { shade: 'String' }, minzoom: 0, maxzoom: 12 }
89
+ ]
90
+ }
91
+ }),
69
92
  ...(options.enableBuildingExtrusions && {
70
93
  'basemap-de': {
71
94
  attribution: 'GeoBasis-DE',
@@ -91,28 +114,30 @@ const style = (opts) => {
91
114
  // 2. Building footprints + Structures (ie. bridges)
92
115
  ...(!options.enableBuildingExtrusions ? [buildingFootprints] : []),
93
116
  ...(options.enableBuildingExtrusions ? [structureExtrusions] : []),
94
- // 3. Tunnels
117
+ // 3. Shaded relief
118
+ ...(options.enableHillshade ? hillshade : []),
119
+ // 4. Tunnels
95
120
  ...walkingTunnels,
96
121
  ...roadTunnels,
97
122
  ...transitTunnels,
98
- // 4. Surface ways
123
+ // 5. Surface ways
99
124
  ...walkingSurface,
100
125
  ...roadSurface,
101
126
  ...transitSurface,
102
- // 5. Bridges ways
127
+ // 6. Bridges ways
103
128
  ...walkingBridges,
104
129
  ...roadBridges,
105
130
  ...transitBridges,
106
- // 6. Admin boundaries
131
+ // 7. Admin boundaries
107
132
  ...admin,
108
- // 7. Labels
133
+ // 8. Labels
109
134
  ...(options.roads?.showLabels ? walkingLabels : []),
110
135
  ...(options.roads?.showLabels ? roadLabels : []),
111
- // 8. Building extrusions
136
+ // 9. Building extrusions
112
137
  ...(options.enableBuildingExtrusions ? [buildingExtrusions] : []),
113
- // 8. Point labels
138
+ // 10. Point labels
114
139
  ...(options.places?.showLabels ? placeLabels : []),
115
- // 9. Admin boundary labels
140
+ // 11. Admin boundary labels
116
141
  ...boundaryLabels
117
142
  ]
118
143
  };
package/dist/maplibre/MapStyle/components/Hillshade.d.ts ADDED
@@ -0,0 +1 @@
1
+ export default function makeHillshade(tokens: any): any;
package/dist/maplibre/MapStyle/components/Hillshade.js ADDED
@@ -0,0 +1,43 @@
1
+ import {} from '../../types';
2
+ export default function makeHillshade(tokens) {
3
+ const hillshade = [
4
+ {
5
+ id: 'hillshade-light',
6
+ filter: ['all', ['==', 'shade', 'light']],
7
+ paint: {
8
+ 'fill-color': tokens.hillshade_light,
9
+ 'fill-opacity': {
10
+ stops: [
11
+ [0, 0],
12
+ [4, 1]
13
+ ]
14
+ },
15
+ 'fill-outline-color': 'transparent',
16
+ 'fill-antialias': true
17
+ }
18
+ },
19
+ {
20
+ id: 'hillshade-dark',
21
+ filter: ['all', ['==', 'shade', 'dark']],
22
+ paint: {
23
+ 'fill-color': tokens.hillshade_dark,
24
+ 'fill-opacity': {
25
+ stops: [
26
+ [0, 0],
27
+ [4, 1]
28
+ ]
29
+ },
30
+ 'fill-outline-color': 'transparent',
31
+ 'fill-antialias': true
32
+ }
33
+ }
34
+ ].map((el) => {
35
+ return {
36
+ type: 'fill',
37
+ 'source-layer': 'hillshade-vectors',
38
+ source: 'versatiles-hillshade',
39
+ ...el
40
+ };
41
+ });
42
+ return { hillshade };
43
+ }
package/dist/maplibre/MapStyle/storyLocations.d.ts CHANGED
@@ -43,5 +43,11 @@ declare const locations: {
43
43
  zoom: number;
44
44
  pitch: number;
45
45
  };
46
+ alps: {
47
+ lng: number;
48
+ lat: number;
49
+ zoom: number;
50
+ pitch: number;
51
+ };
46
52
  };
47
53
  export default locations;
package/dist/maplibre/MapStyle/storyLocations.js CHANGED
@@ -16,6 +16,12 @@ const locations = {
16
16
  lat: 48.77521391139953,
17
17
  zoom: 16,
18
18
  pitch: 45
19
+ },
20
+ alps: {
21
+ lng: 10.01,
22
+ lat: 47.87,
23
+ zoom: 6.54,
24
+ pitch: 0
19
25
  }
20
26
  };
21
27
  export default locations;
package/dist/maplibre/MapStyle/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  interface StyleOptions {
2
2
  enableBuildingExtrusions?: boolean;
3
+ enableHillshade?: boolean;
3
4
  places?: {
4
5
  showLabels?: boolean;
5
6
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@swr-data-lab/components",
3
3
  "description": "SWR Data Lab component library",
4
- "version": "2.33.1",
4
+ "version": "2.34.0",
5
5
  "author": "SWR Data Lab",
6
6
  "license": "UNLICENSED",
7
7
  "type": "module",