Merge pull request #66 from TomPsr/master

Update README/demo
makinacorpus · Jan 15, 2024 · 64ece37 · 64ece37
2 parents 9c695b4 + 54b968b
commit 64ece37
Show file tree

Hide file tree

Showing 14 changed files with 467 additions and 856 deletions.
diff --git a/README.md b/README.md
@@ -1,16 +1,17 @@
 Leaflet.Snap
 ============
 
-Enables snapping of draggable markers to polylines and other layers ! Now updated to work with Leaflet.Draw for Leaflet 1.0!
+Enables snapping of draggable markers to polylines and other layers ! 
+Now updated to work with Leaflet.Draw for Leaflet 1.0!
 
-Check out the [demo](https://makinacorpus.github.io/Leaflet.Snap/) !
+<p align="center">
+<a href="https://www.npmjs.com/package/leaflet-snap"><img alt="npm" src="https://img.shields.io/npm/dt/leaflet-snap"></a>
+<a href="https://www.npmjs.com/package/leaflet-snap"><img alt="npm" src= "https://img.shields.io/npm/v/leaflet-snap?color=red"></a>
+</p>
 
-
-It depends on [Leaflet.GeometryUtil](https://github.com/makinacorpus/Leaflet.GeometryUtil).
-
-For snapping on shape drawing or edition snapping, it also depends on [Leaflet.draw](https://github.com/Leaflet/Leaflet.draw).
-
-If your guide layer contains several thousands for features, adding the [LayerIndex](https://github.com/makinacorpus/Leaflet.LayerIndex) is recommended, this plugin takes advantage of the spatial index if it is available.
+<div class="demo">
+<p align="center">Check out the <a href="https://makinacorpus.github.io/Leaflet.Snap/">demo</a> ! </p>
+</div>
 
 Install
 -----
@@ -20,6 +21,14 @@ In order to use this plugin in your app you can either:
     * `bower install [email protected]:makinacorpus/Leaflet.Snap.git`
 * download the repository and import the `leaflet.snap.js` file in your app.
 
+Dependencies
+-----
+It depends on [Leaflet.GeometryUtil](https://github.com/makinacorpus/Leaflet.GeometryUtil).
+
+For snapping on shape drawing or edition snapping, it also depends on [Leaflet.draw](https://github.com/Leaflet/Leaflet.draw).
+
+If your guide layer contains several thousands for features, adding the [LayerIndex](https://github.com/makinacorpus/Leaflet.LayerIndex) is recommended, this plugin takes advantage of the spatial index if it is available.
+
 Usage
 -----
 

diff --git a/docs/LICENSE b/docs/LICENSE
diff --git a/docs/README.md b/docs/README.md
diff --git a/docs/index.html → docs/example.html b/docs/index.html → docs/example.html
@@ -11,7 +11,7 @@
     <script src="./leaflet.draw.js"></script>
     <script src="./leaflet.geometryutil.js"></script>
 
-    <script src="./leaflet.snap.js"></script>
+    <script src="../leaflet.snap.js"></script>
     <style>
         #map {
             position: absolute;
@@ -35,37 +35,10 @@
             margin: 0px;
             text-align: center;
         }
-
-        .help a.sources {
-            float: left;
-            margin-left: 50px;
-            color: white;
-        }
-
-        .help a.logo {
-            float: right;
-        }
-
-        .help a.logo img {
-            height: 30px;
-        }
-
-        .leaflet-editing-icon.marker-snapped {
-            background-color: yellow;
-        }
-
-        .leaflet-marker-icon.marker-snapped {
-            content: url('marker-snap.png');
-        }
     </style>
 </head>
 
 <body>
-
-    <p class="help">Move stuff around and it will snap !
-        <a class="sources" href="http://github.com/makinacorpus/Leaflet.Snap/">Sources</a>
-        <a class="logo" href="http://makina-corpus.com"><img src="http://depot.makina-corpus.org/public/logo.gif" /></a>
-    </p>
     <div id="map"></div>
 
     <script type="text/javascript">

diff --git a/docs/index.js b/docs/index.js
@@ -0,0 +1,5 @@
+var map = L.map('map').setView([0, 0], 2);
+
+L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
+    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
+}).addTo(map);