diff --git a/index.html b/index.html index 1d2af97..2b0f91c 100644 --- a/index.html +++ b/index.html @@ -1,133 +1,224 @@ + LibreChargeMap - OSM Bliss + content="Carte mondiale visualisant les bornes de recharges pour véhicule électrique à partir des données OpenStreetMap."> - - - - + + + + + content="width=device-width, initial-scale=1.0, user-scalable=yes, minimum-scale=0.25, maximum-scale=5.0"> + - -
-

- prise Libre Charge Map -

-
-
- - -
- Zoomez pour voir les stations de recharge -
-
-
- - - - -
-
-
-
-
- -
-
- - -
-
- -
-
-
-
-
+
+

+ prise Libre Charge Map +

+
+ + + +
+ + + +
+ Zoomez pour voir les stations de recharge +
+
+
+ + + + +
+
+
+
+
+ +
+
+ + +
+
+ +
+
+ +
+ +
+ + + + + +
+ +
+
+ + ? + + + > 7 kW + + + > 20 kW + + + > 50 kW + + + > 100 kW + + + > 200 kW + + + > 300 kW + +
+ +

Cartes des stations de recharge pour véhicules électriques basée sur les données collaborative OpenStreetMap

+ + + + +
+
+ +
+

+ ⚙️ Filtres: +

+
+ qualité + +
+
+ WIP: + mapcomplete + JOSM + id +
+ + + i + mettre un marqueur aux stations qui n'ont pas d'information de + câble + +
+ +
+ + + + + + + + + + + + + + + + + + +
+ + + +
+ +
+ +

+ 🚀 Puissances des stations: 🔽 +

+ +
+ +
+
+
+

+ À propos de ce plan

+

+ La carte thématique proposant des points de charge pour véhicule électrique, basée sur les données + d'OpenStreetMap. Voir la documentation OSM concernant les sockets et les + + stations de recharge pour véhicules électriques + . +


- - ? - - - > 7 kW - - - > 20 kW - - - > 50 kW - - - > 100 kW - - - > 200 kW - - - > 300 kW - + Fait par Tykayn - www.cipherbliss.com. + Sources disponibles sur la forge du Chapril. +
+ type2 + + prise + prise + prise + prise +
+
+ icones + câble électrique Energie + icônes créées par rukanicon - Flaticon +
-

Cartes des stations de recharge pour véhicules électriques basée sur les données collaborative OpenStreetMap

-
- - - - - -
- - - - - @@ -136,104 +227,17 @@
-
-
+ + -
-

- ⚙️ Filtres: -

-
- qualité - -
-
- WIP: - mapcomplete - JOSM - id -
- - - i - mettre un marqueur aux stations qui n'ont pas d'information de câble - -
- -
- - - - - - - - - - - - - - - - - - -
- + + + + + - - - - - - - + - + + \ No newline at end of file diff --git a/js/lcm_config.js b/js/lcm_config.js index 20635fa..edb13b8 100644 --- a/js/lcm_config.js +++ b/js/lcm_config.js @@ -1,15 +1,18 @@ const lcm_config = { - osmMention:'© OpenStreetMap contributors', - showHighPower : true, - overrideQuery : true, - initialZoom : 12, - max_possible_station_output : 400, - tileServers:{ - osm : 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', - cycle : 'https://{s}.tile.thunderforest.org/cycle/{z}/{x}/{y}.png', - cartodb : 'https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', - stamen : 'https://a.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png', - transport : 'https://a.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png' + osmMention: '© OpenStreetMap contributors', + showHighPower: true, + overrideQuery: true, + initialZoom: 12, + hide_osmose_markers_if_close_to_existing_charging_stations: true, + hide_osmose_markers_if_close_to_existing_charging_stations_distance: 5, // meters + + max_possible_station_output: 400, + tileServers: { + osm: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', + cycle: 'https://{s}.tile.thunderforest.org/cycle/{z}/{x}/{y}.png', + cartodb: 'https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}.png', + stamen: 'https://a.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png', + transport: 'https://a.tile.openstreetmap.fr/osmfr/{z}/{x}/{y}.png' }, tags_to_display_in_popup: [ 'description', @@ -39,6 +42,6 @@ const lcm_config = { 'authentication:app', 'authentication:debit_card', ] -} +} export default lcm_config diff --git a/js/lcm_main.js b/js/lcm_main.js index 3a0bcf4..f0938b5 100644 --- a/js/lcm_main.js +++ b/js/lcm_main.js @@ -11,6 +11,9 @@ import { sendToJOSM, createJOSMEditLink } from './lcm_editor.js' let geojsondata; let lastLatLng; +let searchLocationMarker = null; + + // serveurs de tuiles: https://wiki.openstreetmap.org/wiki/Tile_servers // https://stamen-tiles.a.ssl.fastly.net/toner/{z}/{x}/{y}.png @@ -49,6 +52,164 @@ let display_higer_than_200kw = 'show'; let display_chelou = 'show'; // les stations avec une valeur suspecte, plus de 400kW +// Ajouter cette fonction avant searchLocation +function moveToLocation(place) { + const lat = parseFloat(place.lat); + const lon = parseFloat(place.lon); + + if (isNaN(lat) || isNaN(lon)) { + console.error('Coordonnées invalides:', place); + return; + } + + // Supprimer l'ancien marqueur s'il existe + if (searchLocationMarker) { + map.removeLayer(searchLocationMarker); + } + + // Créer un nouveau marqueur avec une icône personnalisée + searchLocationMarker = L.marker([lat, lon], { + icon: L.divIcon({ + className: 'search-location-marker', + html: '📍', + iconSize: [30, 30], + iconAnchor: [15, 30] + }) + }); + + // Ajouter un popup avec le nom du lieu + const popupContent = ` + ${place.display_name} + ${place.type ? `
Type: ${place.type}` : ''} + ${place.context ? `
${place.context}` : ''} + `; + searchLocationMarker.bindPopup(popupContent); + + // Ajouter le marqueur à la carte + searchLocationMarker.addTo(map); + + // Centrer la carte sur le lieu + map.setView([lat, lon], map.getZoom()); + + // Ouvrir le popup automatiquement + searchLocationMarker.openPopup(); + + // Faire disparaître le marqueur après 10 secondes + // setTimeout(() => { + // if (searchLocationMarker) { + // map.removeLayer(searchLocationMarker); + // searchLocationMarker = null; + // } + // }, 10000); +} + +// Déplacer searchLocationWithAddok avant searchLocation +function searchLocationWithAddok(searchText, mapCenter) { + const baseUrl = 'https://demo.addok.xyz/search'; + const params = new URLSearchParams({ + q: searchText, + limit: 10, + lat: mapCenter.lat, + lon: mapCenter.lng + }); + + const url = `${baseUrl}?${params.toString()}`; + + return fetch(url) + .then(response => { + if (!response.ok) { + throw new Error('Erreur réseau lors de la recherche'); + } + return response.json(); + }) + .then(data => { + if (!data.features || data.features.length === 0) { + throw new Error('Aucun résultat trouvé'); + } + return data.features.map(feature => ({ + lat: feature.geometry.coordinates[1], + lon: feature.geometry.coordinates[0], + display_name: feature.properties.label, + importance: feature.properties.score, + context: feature.properties.context, + type: feature.properties.type, + city: feature.properties.city, + distance: feature.properties.distance + })); + }); +} + +// Modifier la fonction searchLocation +function searchLocation() { + const location = $('#searchLocation').val(); + if (!location) { + alert('Veuillez entrer un lieu à rechercher.'); + return; + } + + const useAddok = $('#useAddok').is(':checked'); + const searchPromise = useAddok + ? searchLocationWithAddok(location, map.getCenter()) + : fetch(`https://nominatim.openstreetmap.org/search?format=json&q=${encodeURIComponent(location)}`) + .then(response => response.json()); + + searchPromise + .then(data => { + const resultsDropdown = $('#searchResults'); + resultsDropdown.empty(); + + if (!data || data.length === 0) { + alert('Lieu non trouvé. Veuillez essayer un autre terme de recherche.'); + resultsDropdown.hide(); + return; + } + + // Toujours sélectionner le premier résultat + moveToLocation(data[0]); + + // Si il y a plus d'un résultat, les afficher quand même dans la liste + if (data.length > 1) { + // Ajouter le bouton de fermeture avant la liste des résultats + const closeButton = $('