aboutsummaryrefslogtreecommitdiff
path: root/app/javascript/controllers
diff options
context:
space:
mode:
authorhellekin <hellekin@cepheide.org>2021-02-02 18:39:14 +0100
committerhellekin <hellekin@cepheide.org>2021-02-02 18:39:14 +0100
commit8e404c4f3cf7880681b6f4cdf3c378e084ad54d2 (patch)
tree355caf59f22cd6cb6ca0eb7f36d8d4e970004b72 /app/javascript/controllers
parent288f97605d0af8b027fbfc16703ce4856176dd8c (diff)
downloadincommon-map-8e404c4f3cf7880681b6f4cdf3c378e084ad54d2.tar.gz
Add leaflet-geosearch
This Leaflet plugin adds a live address search on the map. We anticipate the possibility to find POIs from their address, or to check whether an address is already in the database. For now it enables looking up an address. https://smeijer.github.io/leaflet-geosearch/leaflet-control/
Diffstat (limited to 'app/javascript/controllers')
-rw-r--r--app/javascript/controllers/map_controller.js10
1 files changed, 10 insertions, 0 deletions
diff --git a/app/javascript/controllers/map_controller.js b/app/javascript/controllers/map_controller.js
index 57bafa5..0a64f98 100644
--- a/app/javascript/controllers/map_controller.js
+++ b/app/javascript/controllers/map_controller.js
@@ -19,6 +19,7 @@ import "leaflet.markercluster/dist/leaflet.markercluster.js"
import 'leaflet-extra-markers'
import 'leaflet-easyprint'
+import { GeoSearchControl, OpenStreetMapProvider } from 'leaflet-geosearch';
export default class extends Controller {
static targets = [ "container" ]
@@ -75,6 +76,15 @@ export default class extends Controller {
sizeModes: ['A4Portrait', 'A4Landscape']
}).addTo(this.map);
+ /* Add search */
+ const provider = new OpenStreetMapProvider();
+ const searchControl = new GeoSearchControl({
+ provider: provider,
+ style: 'button',
+ position: 'bottomright'
+ });
+ this.map.addControl(searchControl);
+
// Allow calling the mapController from elsewhere.
this.element[this.identifier] = this
}