Neanderthals Programming Machines

    leaflet-nectarivore

    0.3.0 • Public • Published

    License: MIT GitHub release Build Status Coverage Status

    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, 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:

    Installation

    $ npm install leaflet-nectarivore
    

    Usage

    Overpass

    import Nectarivore from 'leaflet-nectarivore';
     
    const attributions = [
      'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors',
      'POI via <a href="https://www.overpass-api.de">Overpass API</a>',
    ];
     
    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 might help.

    Osmose

    import Nectarivore from 'leaflet-nectarivore';
     
    const attributions = [
      'Map data &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors',
      'POI via <a href="http://wiki.openstreetmap.org/wiki/Osmose">Osmose API</a>',
    ];
     
    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

    {
      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

    {
      endpoint: 'https://overpass-api.de/api',
      query: `(
        node({{bbox}})[organic];
        node({{bbox}})[second_hand];
      );
      out qt;`
    }

    Osmose supplemental options

    {
      endpoint: 'https://osmose.openstreetmap.fr/api/0.2',
      language: 'en'
    }

    Contribute

    $ git clone git@github.com:osmlab/leaflet-nectarivore.git leaflet-nectarivore
    $ cd leaflet-nectarivore
    $ npm install
    $ npm run watch
    

    Make a release

    $ 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.
    1. Reference your new service file in the service/index.js file.
    2. Add some tests for your service logic ;) In the services/__tests__ folder.
    3. Add a demo page in the docs folder.
    4. Document your service in the README.md file

    Install

    npm i leaflet-nectarivore

    DownloadsWeekly Downloads

    1

    Version

    0.3.0

    License

    MIT

    Unpacked Size

    264 kB

    Total Files

    6

    Last publish

    Collaborators

    • guillaumeamat
    • ourson