Socket
Socket
Sign inDemoInstall

@raruto/leaflet-edit-osm

Package Overview
Dependencies
1
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @raruto/leaflet-edit-osm

A Leaflet plugin that allows to add an unobtrusive open in OSM Edit link


Version published
Weekly downloads
5
decreased by-76.19%
Maintainers
1
Install size
40.2 kB
Created
Weekly downloads
 

Readme

Source

leaflet-edit-osm.js

A Leaflet plugin that allows to add an unobtrusive open in OSM Edit link

For a working example see demo


Initally based on the work of Tom MacWright

How to use

  1. include CSS & JavaScript
    <head>
    ...
    <style> html, body, #map { height: 100%; width: 100%; padding: 0; margin: 0; } </style>
    <!-- Leaflet (JS/CSS) -->
    <link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css" />
    <script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"></script>
    <!-- Leaflet-Edit-OSM -->
    <link rel="stylesheet" href="https://unpkg.com/@raruto/leaflet-edit-osm/@latest/leaflet-edit-osm.css" />
    <script src="https://unpkg.com/@raruto/leaflet-edit-osm/@latest/leaflet-edit-osm.js"></script>
    ...
    </head>
    
  2. choose a div container used for the slippy map
    <body>
    ...
      <div id="map"></div>
    ...
    </body>
    
  3. create your first simple “leaflet-pegman slippy map
    <script>
      var map = L.map('map');
      map.setView(new L.LatLng(45, 9.5), 5);
    
      var OpenStreetMap = L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
        maxZoom: 19,
        attribution: 'Map data: &copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>',
        });
      OpenStreetMap.addTo(map);
    
      var editInOSMControl = new L.Control.EditInOSM({
        position: 'bottomright', // position of control inside the map
        editor: false, // open link with a default editor ("id", "potlatch2" or "remote")
      });
      editInOSMControl.addTo(map);
    </script>
    

Related: Leaflet-UI presets


Compatibile with: leaflet@1.3.4,


Contributors: tmcw, Raruto

Keywords

FAQs

Last updated on 09 Feb 2020

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc