Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/osmlab/leaflet-nectarivore
Leaflet plugin to create layers based on remote services (Overpass, Osmose, etc.)
https://github.com/osmlab/leaflet-nectarivore
leaflet openstreetmap osm osmose overpass
Last synced: 3 months ago
JSON representation
Leaflet plugin to create layers based on remote services (Overpass, Osmose, etc.)
- Host: GitHub
- URL: https://github.com/osmlab/leaflet-nectarivore
- Owner: osmlab
- License: mit
- Created: 2017-12-10T14:19:46.000Z (about 7 years ago)
- Default Branch: develop
- Last Pushed: 2018-10-06T12:42:35.000Z (over 6 years ago)
- Last Synced: 2024-10-01T14:59:28.550Z (3 months ago)
- Topics: leaflet, openstreetmap, osm, osmose, overpass
- Language: JavaScript
- Size: 784 KB
- Stars: 10
- Watchers: 7
- Forks: 2
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-starred - osmlab/leaflet-nectarivore - Leaflet plugin to create layers based on remote services (Overpass, Osmose, etc.) (others)
README
[![License: MIT](https://img.shields.io/badge/license-MIT-blue.svg)](https://opensource.org/licenses/MIT)
[![GitHub release](https://img.shields.io/github/release/osmlab/leaflet-nectarivore.svg)](https://github.com/osmlab/leaflet-nectarivore/releases)
[![Build Status](https://api.travis-ci.org/osmlab/leaflet-nectarivore.svg?branch=develop)](http://travis-ci.org/osmlab/leaflet-nectarivore)
[![Coverage Status](https://coveralls.io/repos/github/osmlab/leaflet-nectarivore/badge.svg?branch=develop)](https://coveralls.io/github/osmlab/leaflet-nectarivore?branch=develop)# Leaflet Nectarivore
Leaflet Nectarivore is a plugin to create layers based on remote services (Overpass, Osmose, etc.). Its name is a nod to [Leaflet Omnivore](https://github.com/mapbox/leaflet-omnivore), which _eats_ several kind of files to display informations on a Leaflet map. Leaflet Nectarivore _gathers nectar_ from remote services to create its layers on the map.
The first two supported services are Overpass and Osmose. See the demo pages here:
* [Overpass demo page](https://osmlab.github.io/leaflet-nectarivore/overpass.html)
* [Osmose demo page](https://osmlab.github.io/leaflet-nectarivore/osmose.html)## Installation
```
$ npm install leaflet-nectarivore
```## Usage
### Overpass
```javascript
import Nectarivore from 'leaflet-nectarivore';const attributions = [
'Map data © OpenStreetMap contributors',
'POI via Overpass API',
];const tileLayer = new L.TileLayer(
'http://{s}.tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png',
{ attribution: attributions.join(', ') }
);const overpassLayer = Nectarivore.overpass({
minZoom: 15,
endPoint: 'https://overpass-api.de/api',
query: 'node({{bbox}})["amenity"="post_box"];out;',
});const map = new L.Map('my-map')
.addLayer(tileLayer)
.addLayer(overpassLayer)
.setView(L.latLng(44.84061, -0.5724), 15);
```In order to get a valid query the [Overpass-turbo IDE](http://overpass-turbo.eu/) might help.
### Osmose
```javascript
import Nectarivore from 'leaflet-nectarivore';const attributions = [
'Map data © OpenStreetMap contributors',
'POI via Osmose API',
];const tileLayer = new L.TileLayer(
'http://{s}.tiles.wmflabs.org/bw-mapnik/{z}/{x}/{y}.png',
{ attribution: attributions.join(', ') }
);const osmoseLayer = L.Nectarivore.osmose({
minZoom: 15,
endpoint: 'https://osmose.openstreetmap.fr/api/0.2',
language: 'en',
item: 8120,
status: 'open',
});const map = new L.Map('my-map')
.addLayer(tileLayer)
.addLayer(osmoseLayer)
.setView(L.latLng(44.84061, -0.5724), 15);
```## Options
```javascript
{
debug: false,
minZoom: 15,
endpoint: '',
loadedBounds: [],
markerIcon: null,
timeout: 30 * 1000, // Milliseconds
retryOnTimeout: false,
noInitialRequest: false,
beforeRequest: function() {},
afterRequest: function() {},
onSuccess: function(data) {},
onError: function(xhr) {},
onTimeout: function(xhr) {},
}
```### Overpass supplemental options
```javascript
{
endpoint: 'https://overpass-api.de/api',
query: `(
node({{bbox}})[organic];
node({{bbox}})[second_hand];
);
out qt;`
}
```### Osmose supplemental options
```javascript
{
endpoint: 'https://osmose.openstreetmap.fr/api/0.2',
language: 'en'
}
```## Contribute
```
$ git clone [email protected]:osmlab/leaflet-nectarivore.git leaflet-nectarivore
$ cd leaflet-nectarivore
$ npm install
$ npm run watch
```## Make a release
```sh
$ npm version patch -m "release: %s"
$ npm publish
````npm version` tests the code and build it. Then it upgrades the package version number according to the used keyword (patch, minor or major) and commit the modifications in Git (with a proper version tag). Finally, it pushes it to repository with the tag.
### How to add a service
> Please do!
All the plugin logic is in the `services/baseService.js` file. It is then extended by the service logic by creating specific fies in the `services` folder.
So in order to add another service you have to:
1. Create your service file in the `services` folder by duplicating `overpass.js` or `osmose.js`.
2. Replace the service defaultOptions by yours.
3. Replace the logic, you just have to let 4 methods:
* constructor: Called at the plugin instanciation.
* clear: Called when the query/endpoint is replaced by the user.
* buildRequestBounds: Called when the map is moved. It lets you modify the requested bounds.
* buildRequestPromise: Called to build the actual request to the service. It has to return a Promise.
4. Reference your new service file in the `service/index.js` file.
5. Add some tests for your service logic ;) In the `services/__tests__` folder.
6. Add a demo page in the `docs` folder.
7. Document your service in the `README.md` file