|
1 | 1 | # OpenMapSamples-MapLibre |
2 | 2 |
|
3 | | -[OpenMapSamples](https://github.com/adamfranco/OpenMapSamples) is a library to generate and provide |
4 | | -sample data for testing vector-based map renderings. Sample data is returned as GeoJSON and can be |
5 | | -rendered by mapping systems and styles to validate their coverage of combinations of data at different |
| 3 | +[OpenMapSamples](https://github.com/adamfranco/OpenMapSamples) is a library to generate and provide |
| 4 | +sample data for testing vector-based map renderings. Sample data is returned as GeoJSON and can be |
| 5 | +rendered by mapping systems and styles to validate their coverage of combinations of data at different |
6 | 6 | zooms without hand-mapping all possible combinations. |
7 | 7 |
|
8 | 8 | The **OpenMapSamples-MapLibre** package provides a [MapLibre](https://github.com/maplibre) control |
9 | 9 | that allows OpenMapSamples to be swapped for real data in MapLibre-based maps. |
10 | 10 |
|
11 | | -You can view a demonstration of this control at https://adamfranco.github.io/OpenMapSamples-MapLibre/. |
12 | | -Look for the control in the bottom left of the map and choose a sample to replace the normal map data |
| 11 | +You can view a demonstration of this control at https://adamfranco.github.io/OpenMapSamples-examples/. |
| 12 | +Look for the control in the bottom left of the map and choose a sample to replace the normal map data |
13 | 13 | with sample data and jump to the sample-data locations. |
14 | 14 |
|
15 | 15 |  |
16 | 16 |
|
17 | | -## Development and demo. |
| 17 | +## Usage |
18 | 18 |
|
19 | | -Use `npm install --include=dev` to install all of the main dependencies and development dependencies. |
| 19 | +The SampleControl for MapLibre provides a button and dialog that temporarily replaces the source data in the map's style with sample data. |
20 | 20 |
|
21 | | -Add a file called `.env` in the project root and add a personal MapTiler cloud key like this: |
22 | | -``` |
23 | | -MAPTILER_API_KEY=YourMapTileAPIKey |
24 | | -``` |
25 | | -You can register a free MapTiler API Key at: https://cloud.maptiler.com/account/keys/ |
26 | | - |
27 | | -After your `.env` file is in place you can start the demo with: |
28 | | - |
29 | | -``` |
30 | | -npm start |
31 | 21 | ``` |
| 22 | +import SampleControl from 'openmapsamples-maplibre/OpenMapSamplesControl'; |
| 23 | +import { default as OpenMapTilesSamples } from "openmapsamples/samples/OpenMapTiles"; |
32 | 24 |
|
33 | | -### Building the demo |
| 25 | +// Add our sample data. |
| 26 | +let sampleControl = new SampleControl({'permalinks': true}); |
34 | 27 |
|
35 | | -Running this command will build a self-contained build of the demo site in the `dist/` directory: |
| 28 | +OpenMapTilesSamples.forEach((sample, i) => { |
| 29 | + sampleControl.addSample(sample); |
| 30 | +}); |
36 | 31 |
|
37 | | -``` |
38 | | -npm run build |
| 32 | +// Map is a previously configure maplibre-gl map. |
| 33 | +map.addControl(sampleControl, 'bottom-left'); |
39 | 34 | ``` |
0 commit comments