From 1bf91d26645769545baff16392e679f879255f12 Mon Sep 17 00:00:00 2001 From: Abba Danmusa Date: Sun, 23 Oct 2022 21:16:32 +0100 Subject: [PATCH 1/2] Added the missing closing body tags to export.html and select.html --- examples/export.html | 305 +++++++++++++++++++++++-------------------- examples/select.html | 140 ++++++++++---------- 2 files changed, 236 insertions(+), 209 deletions(-) diff --git a/examples/export.html b/examples/export.html index 816a62601..4128bd05b 100644 --- a/examples/export.html +++ b/examples/export.html @@ -1,147 +1,170 @@ + - Leaflet.DistortableImage Example - - - - - - - - - - - + Leaflet.DistortableImage Example + + + + + + + + + + + + -
- -
- -
- - - +
+ +
+ +
+ + + + + \ No newline at end of file diff --git a/examples/select.html b/examples/select.html index b905f23d8..dbfff8e67 100644 --- a/examples/select.html +++ b/examples/select.html @@ -1,85 +1,89 @@ + - Leaflet.DistortableImage Example - - - + Leaflet.DistortableImage Example + + + - - - + + + - - - + + + + -
- -
+
+ +
+ +
-
+ + - /* TODO: make an addLayers func */ - imgGroup.addLayer(img); - imgGroup.addLayer(img2); - imgGroup.addLayer(img3); - imgGroup.addLayer(img4); - }); - })(); - - + \ No newline at end of file From 950a16f5aa14c1377a132f0bcc581ca6dee139f4 Mon Sep 17 00:00:00 2001 From: Abba Danmusa Date: Sun, 23 Oct 2022 22:17:18 +0100 Subject: [PATCH 2/2] Transfer js code in select.html into separate .js file --- examples/js/select.js | 58 ++++++++++++++++++++++++++++++++++++++++ examples/select.html | 61 +------------------------------------------ 2 files changed, 59 insertions(+), 60 deletions(-) create mode 100644 examples/js/select.js diff --git a/examples/js/select.js b/examples/js/select.js new file mode 100644 index 000000000..35d616f73 --- /dev/null +++ b/examples/js/select.js @@ -0,0 +1,58 @@ +let map; + +(function() { + map = L.map('map').setView([51.505, -0.09], 13); + map.addGoogleMutant(); + + map.whenReady(function() { + img = L.distortableImageOverlay('example.jpg', { + corners: [ + L.latLng(51.52, -0.14), + L.latLng(51.52, -0.10), + L.latLng(51.50, -0.14), + L.latLng(51.50, -0.10), + ], + mode: 'lock', + }); + + // create a second image + img2 = L.distortableImageOverlay('example.jpg', { + corners: [ + L.latLng(51.51, -0.20), + L.latLng(51.51, -0.16), + L.latLng(51.49, -0.21), + L.latLng(51.49, -0.17), + ], + mode: 'freeRotate', + suppressToolbar: true, + }); + + img3 = L.distortableImageOverlay('example.jpg', { + corners: [ + L.latLng(51.50, -0.13), + L.latLng(51.50, -0.09), + L.latLng(51.48, -0.14), + L.latLng(51.48, -0.10), + ], + actions: [L.DistortAction, L.FreeRotateAction, L.LockAction, L.OpacityAction, L.DeleteAction], + }); + + img4 = L.distortableImageOverlay('example.jpg', { + actions: [L.ScaleAction, L.DistortAction, L.RotateAction, L.FreeRotateAction, L.LockAction, L.OpacityAction, L.DeleteAction], + corners: [ + L.latLng(51.51, -0.07), + L.latLng(51.51, -0.03), + L.latLng(51.49, -0.08), + L.latLng(51.49, -0.04), + ], + }); + + imgGroup = L.distortableCollection().addTo(map); + + /* TODO: make an addLayers func */ + imgGroup.addLayer(img); + imgGroup.addLayer(img2); + imgGroup.addLayer(img3); + imgGroup.addLayer(img4); + }); +})(); diff --git a/examples/select.html b/examples/select.html index dbfff8e67..2da30d74a 100644 --- a/examples/select.html +++ b/examples/select.html @@ -14,6 +14,7 @@ + @@ -24,66 +25,6 @@
- \ No newline at end of file