diff --git a/static/map.js b/static/map.js
index 5b175d8..820ae2a 100644
--- a/static/map.js
+++ b/static/map.js
@@ -18,6 +18,7 @@
// ── Map setup (deferred to init section below) ─────────────
let map;
let clusterGroup;
+ let locateMarker = null;
// ── Colour helpers ─────────────────────────────────────────
function priceColor(price, min, max) {
@@ -284,6 +285,41 @@
// Create map and cluster group now that the DOM is ready.
map = L.map('map', { zoomControl: false }).setView([46.8, -71.2], 7);
L.control.zoom({ position: 'topright' }).addTo(map);
+
+ // ── Locate-me control ──────────────────────────────────
+ var LocateControl = L.Control.extend({
+ options: { position: 'bottomright' },
+ onAdd: function () {
+ var container = L.DomUtil.create('div', 'leaflet-bar leaflet-control');
+ var btn = L.DomUtil.create('a', '', container);
+ btn.href = '#';
+ btn.title = 'Ma position';
+ btn.setAttribute('role', 'button');
+ btn.setAttribute('aria-label', 'Ma position');
+ btn.innerHTML = '';
+ L.DomEvent.on(btn, 'click', function (e) {
+ L.DomEvent.preventDefault(e);
+ if (!navigator.geolocation) return;
+ navigator.geolocation.getCurrentPosition(function (pos) {
+ var latlng = [pos.coords.latitude, pos.coords.longitude];
+ map.setView(latlng, 14);
+ if (locateMarker) {
+ locateMarker.setLatLng(latlng);
+ } else {
+ locateMarker = L.circleMarker(latlng, {
+ radius: 10,
+ color: '#fff',
+ weight: 3,
+ fillColor: '#2563eb',
+ fillOpacity: 1,
+ }).addTo(map);
+ }
+ });
+ });
+ return container;
+ },
+ });
+ new LocateControl().addTo(map);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© OpenStreetMap | Données: Régie de l\'énergie du Québec',
maxZoom: 18,